You are on page 1of 8

<!

DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Seven</title>
<meta name="viewport" content="width=device-width, initial-scale=0.3">
<script src="https://cdn.jsdelivr.net/npm/eosjs@16.0.0/lib/eos.min.js"
integrity="sha512-
vNyLnOEb7uFmEtVbLnyZQ9/k4zckM2Vu3jJOKq6XfWEVZG0yKcjDExVN4EQ7e3F+rePWRncMolI2xFi/3qo
62A=="
crossorigin="anonymous"></script>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous">
<link rel="stylesheet" href="./main.css">
</head>

<body>
<div class="container-fluid" style="background-image: url('./img/back720.png');
width: 1200px; padding: 0%; height: 720px">
<div style="background-image: url('./img/16_720.png'); height: 720px;
background-repeat: no-repeat; margin: 0px; width: 100%;">
<div class="d-flex justify-content-center">
<input type="image" src="./img/55.png" alt="Mute" id="mute"
style="width: 100px; height: 100px; padding-top: 20px; padding-right: 10px;">
<input type="image" src="./img/18.png" alt="Rules" data-
toggle="modal" data-target="#rules" style="height: 90px; width: 180px; padding-top:
20px;">
<div class="modal" id="rules">
<div class="modal-dialog" style=" margin-left: 150px; width:
1024px; margin-right: 0px;">
<div class="modal-content" style=" width: 1025.979166px;
margin-left: 200px; border-left-width: 0px; border-top-width: 0px; border-right-
width: 0px; border-bottom-width: 0px;">

<!-- Modal Header -->


<div class="modal-header" style=" padding-left: 0px;
padding-bottom: 0px; ">
<button type="button" class="close" data-
dismiss="modal">&times;</button>
</div>

<!-- Modal body -->


<div class="modal-body" style=" padding-left: 0px;
padding-right: 0px; padding-bottom: 0px; ">
<!--<img src="./img/3.png" alt="Rules"
width="1025px">-->
<ol>
<li> Se7ens is a provably fair chance dice
game.</li> <br>

<li>You win by correctly betting if the dice


total will be greater than, equal to,
or
less than 7.</li> <br>
<li> Start off by clicking Above 7, 7, or Below
7.</li> <br>

<li> Next, it's time to pick the token amount


you want to bet.</li> <br>

<li> Then roll the dice and test your


luck.</li> <br>

<li> Payouts are x2 if dice are over or under 7


and x6 if dice equal 7.</li> <br>

<li> Players will recieve divedends determined


on the total amount of seven tokens
they
own.</li> <br>

<li> 33% of the total bankroll/winning pool


tokens will be distributed back to
token
holders once a month.</li>
</ol>

</div>

<!-- Modal footer -->


<div class="modal-footer">
<button type="button" class="btn btn-danger" data-
dismiss="modal">Close</button>
</div>

</div>
</div>
</div>
<div style="background-image: url('./img/44.png'); background-
repeat: no-repeat; width: 511px; height: 142px;margin-left: 80px;">
<center>
<h4 class="text-white mt-4" id="balance">Balance</h4>
</center>
</div>
<div class="btn-group-lg" style="margin-left: 130px; margin-top:
40px;">
<button type="button" class="btn btn-success" id="login"
style="width:114px;">Login</button>
<!-- <button type="button" class="btn btn-danger"
id="logout">Logout</button>-->
</div>
</div>

<br>
<div class="d-flex justify-content-center" style="height:60px">
<h2 class="text-white" id="title" style="text-shadow: 3px 2px
red;"><strong> Instructions</strong></h2>
</div>
<div class="row" style="max-height: 100%;">
<!--First colum of bet selection-->
<div style="background-color: rgba(235, 135, 135, 0); width: 15%;">
<div style="height:35%;background-color: rgba(235, 135, 135,
0);">
</div>
<!--Bet selection-->
<div class="cc-selector d-flex flex-column bd-highlight mb-3"
style="height:65%;background-color: rgba(135, 220, 235, 0); padding-left: 40px;
padding-top: 15px;">

<input type="radio" name="bet_type" value="2" id="above"


onclick="handleClickType(this)" />
<label class="drinkcard-cc above" for="above"> </label>

<input type="radio" name="bet_type" value="1" id="equal"


onclick="handleClickType(this)" />
<label class="drinkcard-cc equal" for="equal"></label>

<input type="radio" name="bet_type" value="0" id="below"


onclick="handleClickType(this)" />
<label class="drinkcard-cc below" for="below"></label>

</div>
</div>
<!--Second column for spining dice and bet amount-->
<div style=" width: 73%;">
<!--spin dices-->
<div class="row" style="height:75%;background-color: rgba(135,
235, 157, 0);">
<center style="padding-left:300px; padding-top:200px;"><img
src="./img/dices/1.png" alt="dice"
style="width:150px" id="dice_1"><img
src="./img/dices/1.png" alt="dice" style="width:150px"
id="dice_2"></center>
</div>
<!--Bet amount-->
<div class="cc-selector row" style="height:25%;background-
color: rgba(217, 235, 135, 0); padding-left: 200px;">
<input type="radio" name="bet_amount" value="500.0000"
id="bet_500" onclick="handleClickAmount(this)" />
<label class="drinkcard-cc bet_500" for="bet_500"> </label>

<input type="radio" name="bet_amount" value="1000.0000"


id="bet_1000" onclick="handleClickAmount(this)" />
<label class="drinkcard-cc bet_1000"
for="bet_1000"></label>

<!-- <input type="radio" name="bet_amount" value="2500.0000"


id="bet_2500" onclick="handleClickAmount(this)" />
<label class="drinkcard-cc bet_2500"
for="bet_2500"></label>

<input type="radio" name="bet_amount" value="5000.0000"


id="bet_5000" onclick="handleClickAmount(this)" />
<label class="drinkcard-cc bet_5000"
for="bet_5000"></label>

<input type="radio" name="bet_amount" value="10000.0000"


id="bet_10000" onclick="handleClickAmount(this)" />
<label class="drinkcard-cc bet_10000"
for="bet_10000"></label>-->
</div>

</div>
<!--thrid column for placing bet button-->
<div style="background-color: rgba(173, 135, 235, 0); width: 12%;">
<div style="height:65%;background-color: rgba(235, 135, 135,
0);">

</div>
<div style="height:35%;background-color: rgba(135, 220, 235,
0);">
<input type="image" src="./img/22.png" alt="Roll now"
id="roll_btn" style="width: 120px;padding-left: 0px; margin-left: 0px; margin-top:
40px;"
disabled>
</div>
</div>
</div>
<!--Sounds-->
<iframe src="./sounds/silent.mp3" allow="autoplay" id="audio"
hidden></iframe>
<audio id="background" src="./sounds/background_music_verylow.mp3"
preload="auto" autoplay loop></audio>
<audio id="bet_amount_sound" src="./sounds/bet amount.mp3"
preload="auto"></audio>
<audio id="bet_type_sound" src="./sounds/bet high low or exact.mp3"
preload="auto"></audio>
<audio id="dice_roll" src="./sounds/dice roll.m4a"
preload="auto"></audio>
<audio id="win" src="./sounds/Slot Win.wav" preload="auto"></audio>
</div>
</div>

<script>
let title = document.getElementById("title");
let balance = document.getElementById("balance");

/// sounds
let background_sound = document.getElementById("background");
let mute = document.getElementById("mute");
let bet_amount_sound = document.getElementById("bet_amount_sound");
let bet_type_sound = document.getElementById("bet_type_sound");
let dice_roll_sound = document.getElementById("dice_roll");
let win_sound = document.getElementById("win");

///scatter section
let login = document.getElementById("login");
let scatter_status = false;
//let logout = document.getElementById("logout");

/// Roll button


let roll_button = document.getElementById("roll_btn");
let dice_1 = document.getElementById("dice_1");
let dice_2 = document.getElementById("dice_2");

mute.addEventListener("click", function () {
mute_sound();
});
function mute_sound() {
background_sound.muted = true;
}

/// Bet Type value

let bet_type_value = null;


function handleClickType(bet_type) {
bet_type_sound.play();
bet_type_value = bet_type.value;

if (bet_Amount_value == null) {
title.innerHTML = "Now Select Bet Amount, Please!";
} else if (bet_Amount_value != null && scatter_status == true) {
title.innerHTML = "Now Roll the dice";
roll_button.removeAttribute("disabled");

} else {
title.innerHTML = "Now login with scatter, Please!";
}
}

/// Bet Amount Value

let bet_Amount_value = null;


function handleClickAmount(bet_Amount) {
bet_amount_sound.play();
bet_Amount_value = bet_Amount.value;

if (bet_type_value == null) {
title.innerHTML = "Now Select Bet type, Please!";
} else if (bet_type_value != null && scatter_status == true) {
title.innerHTML = "Now Roll the dice";
roll_button.removeAttribute("disabled");
} else {
title.innerHTML = "Now login with scatter, Please!";
}
}

document.addEventListener("scatterLoaded", scatterExtension => {

const scatter = window.scatter;


window.scatter = null;
const network = {
blockchain: "eos",
protocol: "https",
host: "nodes.get-scatter.com",
port: 443,
chainId:
"aca376f206b8fc25a6ed44dbdc66547c36c6c33e3a119ffbeaef943642f0e906"
};
const eosOptions = {
broadcast: true,
sign: true
};
//scatter.suggestNetwork(network);
const requiredFields = {
accounts: [network]
};
const eos = scatter.eos(network, Eos, eosOptions);
title.innerHTML = "Now you can Play Se7ens Game, Enjoy!";

var name = "";


login.addEventListener("click", function () {
login_scatter();
});

function login_scatter() {
if (scatter_status == true) {
scatter.forgetIdentity();
title.innerHTML = "Now you are Logged-out";
scatter_status = false;
roll_button.disabled = true;
balance.innerHTML = "Balance:";
login.innerHTML = "Login";
}else if (bet_Amount_value == null || bet_type_value == null) {
title.innerHTML = "Please, select Bet Type and Bet Amount
first"
} else {
scatter.getIdentity(requiredFields).then(identity => {

name = identity.accounts[0].name;

title.innerHTML = "Congratulations " + name;


scatter_status = true;
login.innerHTML = "Logout";
if (bet_Amount_value != null && bet_type_value != null) {
roll_button.removeAttribute("disabled");
title.innerHTML = "Now Roll the dice";
roll_button.addEventListener("click", function () {
place_bet();
});
function place_bet() {
title.innerHTML =
"Rolling...</br>If it takes too long, check your network
connection speed, Please";
dice_roll_sound.play();
eos.contract("xxxsevensxxx").then(contract => {
contract
.bet(
name,
"xxxsevensxxx",
bet_Amount_value + " SEVEN",
bet_type_value
)
.then(trx => {
console.log(trx);
let res_result =

trx.processed.action_traces[0].inline_traces[0].act.data;
//console.log("rolls = ", res_result);
title.innerHTML =
res_result.bet_result == "lose"
? "Good Luck Next time!"
: "Congratulations! you won bet amount +
bonus = " +
res_result.win_amount;
if (res_result.bet_result != "lose")
win_sound.play();
if (res_result.bet_result == "bonus")
title.innerHTML = "<img src='./img/25.png'
width='847px'>";

if (res_result.roll1 == "1") dice_1.src =


"./img/dices/1.png";
else if (res_result.roll1 == "2") dice_1.src =
"./img/dices/2.png";
else if (res_result.roll1 == "3") dice_1.src =
"./img/dices/3.png";
else if (res_result.roll1 == "4") dice_1.src =
"./img/dices/4.png";
else if (res_result.roll1 == "5") dice_1.src =
"./img/dices/5.png";
else if (res_result.roll1 == "6") dice_1.src =
"./img/dices/6.png";

if (res_result.roll2 == "1") dice_2.src =


"./img/dices/1.png";
else if (res_result.roll2 == "2") dice_2.src =
"./img/dices/2.png";
else if (res_result.roll2 == "3") dice_2.src =
"./img/dices/3.png";
else if (res_result.roll2 == "4") dice_2.src =
"./img/dices/4.png";
else if (res_result.roll2 == "5") dice_2.src =
"./img/dices/5.png";
else if (res_result.roll2 == "6") dice_2.src =
"./img/dices/6.png";

eos
.getCurrencyBalance({
code: "xxxsevensxxx",
account: name,
symbol: "SEVEN"
})
.then(result => {
balance.innerHTML =
result[0] == undefined
? "0.0000 SEVEN"
: "<strong>" + name + "</strong>
has</br>" + result[0];
});
})
.catch(err => {
console.log(err);
});
});
}
}

eos
.getCurrencyBalance({
code: "xxxsevensxxx",
account: name,
symbol: "SEVEN"
})
.then(result => {
balance.innerHTML =
result[0] == undefined
? "0.0000 SEVEN"
: "<strong>" + name + "</strong> has</br>"
+ result[0];
});
}); //get Identity function
}
}
});

</script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
crossorigin="anonymous"></script>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</body>

</html>

You might also like