x
This commit is contained in:
parent
02432766f8
commit
732d463b82
1 changed files with 47 additions and 44 deletions
91
index.html
91
index.html
|
|
@ -70,18 +70,17 @@
|
||||||
.floating-bet {
|
.floating-bet {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
color: white;
|
color: white;
|
||||||
font-size: 18px;
|
animation: floatBet 1s ease-out forwards;
|
||||||
font-weight: bold;
|
pointer-events: none;
|
||||||
animation: floatAndDisappear 2s forwards;
|
|
||||||
}
|
}
|
||||||
@keyframes floatAndDisappear {
|
@keyframes floatBet {
|
||||||
0% {
|
0% {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
transform: translateY(0);
|
transform: translateY(0);
|
||||||
}
|
}
|
||||||
100% {
|
100% {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transform: translateY(-100px);
|
transform: translateY(-50px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
input[type="email"], input[type="text"], input[type="tel"], input[type="number"], textarea {
|
input[type="email"], input[type="text"], input[type="tel"], input[type="number"], textarea {
|
||||||
|
|
@ -182,7 +181,7 @@
|
||||||
}
|
}
|
||||||
95% {
|
95% {
|
||||||
box-shadow: var(--neon-shadow);
|
box-shadow: var(--neon-shadow);
|
||||||
border-color: var(--primary-neon);
|
border-color: var (--primary-neon);
|
||||||
}
|
}
|
||||||
95.01% {
|
95.01% {
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
|
|
@ -209,13 +208,13 @@
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background-color: #000;
|
background-color: #000;
|
||||||
border: 1px solid #fff;
|
|
||||||
padding: 10px 15px;
|
padding: 10px 15px;
|
||||||
border-radius: 50px;
|
border-radius: 50px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
z-index: 30; /* Ensures it is above other elements */
|
z-index: 30; /* Ensures it is above other elements */
|
||||||
|
border: 1px solid #fff;
|
||||||
}
|
}
|
||||||
.live-chat-btn:hover {
|
.live-chat-btn:hover {
|
||||||
background-color: #333;
|
background-color: #333;
|
||||||
|
|
@ -322,7 +321,11 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="bet-buttons">
|
<div class="bet-buttons">
|
||||||
<button class="btn-place" onclick="placeBet('Lion')">Bet Lion</button>
|
<button class="btn-place" onclick="placeBet('Lion')">Bet Lion</button>
|
||||||
<button class="btn-confirm" onclick="placeBet('Buffalo')">Bet Buffalo</button>
|
<button class="btn-confirm" onclick="placeBet('Giraffe')">Bet Giraffe</button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>Total Bets on Lion: <span id="totalBetsLion">0</span></p>
|
||||||
|
<p>Total Bets on Buffalo: <span id="totalBetsBuffalo">0</span></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -337,10 +340,10 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
const WORKER_URL = 'https://instinct-api.yazdani.dev';
|
const WORKER_URL = 'https://instinct-api.yazdani.dev'; // Updated API URL
|
||||||
let userEmail = '';
|
let userEmail = '';
|
||||||
let defaultBetSize = 0;
|
let defaultBetSize = 0;
|
||||||
let eventID = 8; // Default event ID
|
let eventID = 98; // Set the event ID to a fixed value
|
||||||
|
|
||||||
async function navigateTo(pageId) {
|
async function navigateTo(pageId) {
|
||||||
document.querySelectorAll('.page').forEach(page => {
|
document.querySelectorAll('.page').forEach(page => {
|
||||||
|
|
@ -376,6 +379,7 @@
|
||||||
if (--timer < 0) {
|
if (--timer < 0) {
|
||||||
countdownElement.style.display = 'none';
|
countdownElement.style.display = 'none';
|
||||||
clearInterval(countdownTimer);
|
clearInterval(countdownTimer);
|
||||||
|
// Only create and display the video after the countdown finishes
|
||||||
var iframe = document.createElement('iframe');
|
var iframe = document.createElement('iframe');
|
||||||
iframe.src = "https://customer-0sb72e7akfw9m0dg.cloudflarestream.com/7d7cb4e7e6ead747b72073c3824a9d3f/iframe?preload=true&autoplay=true&poster=https%3A%2F%2Fcustomer-0sb72e7akfw9m0dg.cloudflarestream.com%2F7d7cb4e7e6ead747b72073c3824a9d3f%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false";
|
iframe.src = "https://customer-0sb72e7akfw9m0dg.cloudflarestream.com/7d7cb4e7e6ead747b72073c3824a9d3f/iframe?preload=true&autoplay=true&poster=https%3A%2F%2Fcustomer-0sb72e7akfw9m0dg.cloudflarestream.com%2F7d7cb4e7e6ead747b72073c3824a9d3f%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false";
|
||||||
iframe.style.cssText = 'border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;';
|
iframe.style.cssText = 'border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;';
|
||||||
|
|
@ -383,6 +387,7 @@
|
||||||
iframe.allowfullscreen = true;
|
iframe.allowfullscreen = true;
|
||||||
videoFrame.appendChild(iframe);
|
videoFrame.appendChild(iframe);
|
||||||
|
|
||||||
|
// Listen for the end of the first video
|
||||||
iframe.onload = function () {
|
iframe.onload = function () {
|
||||||
var firstVideo = iframe.contentWindow.document.querySelector('video');
|
var firstVideo = iframe.contentWindow.document.querySelector('video');
|
||||||
if (firstVideo) {
|
if (firstVideo) {
|
||||||
|
|
@ -396,7 +401,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
function playEndingVideo(videoFrame) {
|
function playEndingVideo(videoFrame) {
|
||||||
|
// Remove the first video
|
||||||
videoFrame.innerHTML = '';
|
videoFrame.innerHTML = '';
|
||||||
|
// Add the ending video
|
||||||
var iframe = document.createElement('iframe');
|
var iframe = document.createElement('iframe');
|
||||||
iframe.src = "https://customer-0sb72e7akfw9m0dg.cloudflarestream.com/ea82c3f795b5a68a78ef3d44c85a689f/watch/iframe?preload=true&autoplay=true";
|
iframe.src = "https://customer-0sb72e7akfw9m0dg.cloudflarestream.com/ea82c3f795b5a68a78ef3d44c85a689f/watch/iframe?preload=true&autoplay=true";
|
||||||
iframe.style.cssText = 'border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;';
|
iframe.style.cssText = 'border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;';
|
||||||
|
|
@ -418,7 +425,7 @@
|
||||||
messageElement.classList.add('message');
|
messageElement.classList.add('message');
|
||||||
messageElement.textContent = message;
|
messageElement.textContent = message;
|
||||||
document.getElementById('liveMessages').appendChild(messageElement);
|
document.getElementById('liveMessages').appendChild(messageElement);
|
||||||
document.getElementById('chatBox').value = '';
|
document.getElementById('chatBox').value = ''; // Clear the input after sending
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -437,7 +444,7 @@
|
||||||
|
|
||||||
async function saveUserData() {
|
async function saveUserData() {
|
||||||
if (document.getElementById('bypassValidation').checked) {
|
if (document.getElementById('bypassValidation').checked) {
|
||||||
navigateTo('page3');
|
navigateTo('page3'); // Skip validation and navigate to next page
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -452,7 +459,7 @@
|
||||||
body: JSON.stringify(userData)
|
body: JSON.stringify(userData)
|
||||||
});
|
});
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
navigateTo('page3');
|
navigateTo('page3'); // Navigate to the next page after saving data
|
||||||
} else {
|
} else {
|
||||||
console.error('Failed to save user data');
|
console.error('Failed to save user data');
|
||||||
}
|
}
|
||||||
|
|
@ -463,37 +470,38 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
async function placeBet(team) {
|
async function placeBet(team) {
|
||||||
const amount = defaultBetSize;
|
|
||||||
const response = await fetch(`${WORKER_URL}/bet`, {
|
const response = await fetch(`${WORKER_URL}/bet`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: { 'Content-Type': 'application/json' },
|
headers: { 'Content-Type': 'application/json' },
|
||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
email: userEmail,
|
email: userEmail,
|
||||||
event: eventID,
|
event: eventID, // Use the eventID variable here
|
||||||
team: team === 'Lion' ? 0 : 1,
|
team: team === 'Lion' ? 0 : 1,
|
||||||
amount: amount
|
amount: defaultBetSize
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
console.log('Bet placed successfully');
|
console.log('Bet placed successfully');
|
||||||
showFloatingBet(amount);
|
|
||||||
await fetchUserBalance();
|
await fetchUserBalance();
|
||||||
await fetchTotalBets();
|
await fetchTotalBets();
|
||||||
|
animateBet(team);
|
||||||
} else {
|
} else {
|
||||||
console.error('Failed to place bet');
|
console.error('Failed to place bet');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function showFloatingBet(amount) {
|
function animateBet(team) {
|
||||||
const betButton = event.target;
|
const betButton = document.querySelector(team === 'Lion' ? '.btn-place' : '.btn-confirm');
|
||||||
const floatingBet = document.createElement('div');
|
const betAmount = document.createElement('div');
|
||||||
floatingBet.classList.add('floating-bet');
|
betAmount.classList.add('floating-bet');
|
||||||
floatingBet.textContent = `$${amount}`;
|
betAmount.textContent = `$${defaultBetSize}`;
|
||||||
betButton.appendChild(floatingBet);
|
document.body.appendChild(betAmount);
|
||||||
|
const rect = betButton.getBoundingClientRect();
|
||||||
floatingBet.addEventListener('animationend', () => {
|
betAmount.style.left = `${rect.left + window.scrollX}px`;
|
||||||
floatingBet.remove();
|
betAmount.style.top = `${rect.top + window.scrollY}px`;
|
||||||
});
|
setTimeout(() => {
|
||||||
|
betAmount.remove();
|
||||||
|
}, 1000);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function fetchUserBalance() {
|
async function fetchUserBalance() {
|
||||||
|
|
@ -501,31 +509,24 @@
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
const userData = await response.json();
|
const userData = await response.json();
|
||||||
document.getElementById('userBalance').textContent = userData.balance || '0';
|
document.getElementById('userBalance').textContent = userData.balance || '0';
|
||||||
checkBalance(userData.balance);
|
// Disable bet buttons if balance is insufficient
|
||||||
|
const betButtons = document.querySelectorAll('.bet-buttons button');
|
||||||
|
if (userData.balance < defaultBetSize) {
|
||||||
|
betButtons.forEach(button => button.disabled = true);
|
||||||
|
} else {
|
||||||
|
betButtons.forEach(button => button.disabled = false);
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
console.error('Failed to fetch user balance');
|
console.error('Failed to fetch user balance');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function checkBalance(balance) {
|
|
||||||
const betButtons = document.querySelectorAll('.btn-place, .btn-confirm');
|
|
||||||
betButtons.forEach(button => {
|
|
||||||
if (balance <= 0) {
|
|
||||||
button.disabled = true;
|
|
||||||
button.style.opacity = 0.5;
|
|
||||||
} else {
|
|
||||||
button.disabled = false;
|
|
||||||
button.style.opacity = 1;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
async function fetchTotalBets() {
|
async function fetchTotalBets() {
|
||||||
const response = await fetch(`${WORKER_URL}/totals?event=${eventID}`, { method: 'GET' });
|
const response = await fetch(`${WORKER_URL}/totals?event=${eventID}`, { method: 'GET' });
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
const totals = await response.json();
|
const totals = await response.json();
|
||||||
const totalBetsLion = totals.find(bet => bet.team === 0)?.total || 0;
|
const totalBetsLion = totals.bets.find(bet => bet.team === 0)?.total || 0;
|
||||||
const totalBetsBuffalo = totals.find(bet => bet.team === 1)?.total || 0;
|
const totalBetsBuffalo = totals.bets.find(bet => bet.team === 1)?.total || 0;
|
||||||
document.getElementById('totalBetsLion').textContent = totalBetsLion;
|
document.getElementById('totalBetsLion').textContent = totalBetsLion;
|
||||||
document.getElementById('totalBetsBuffalo').textContent = totalBetsBuffalo;
|
document.getElementById('totalBetsBuffalo').textContent = totalBetsBuffalo;
|
||||||
} else {
|
} else {
|
||||||
|
|
@ -535,7 +536,7 @@
|
||||||
|
|
||||||
function generateRandomAvatars() {
|
function generateRandomAvatars() {
|
||||||
const avatarsContainer = document.querySelector('.avatars');
|
const avatarsContainer = document.querySelector('.avatars');
|
||||||
avatarsContainer.innerHTML = '';
|
avatarsContainer.innerHTML = ''; // Clear existing avatars
|
||||||
|
|
||||||
for (let i = 0; i < 4; i++) {
|
for (let i = 0; i < 4; i++) {
|
||||||
const avatarId = Math.floor(Math.random() * 1000000);
|
const avatarId = Math.floor(Math.random() * 1000000);
|
||||||
|
|
@ -547,6 +548,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Add to Home Screen Prompt
|
||||||
let deferredPrompt;
|
let deferredPrompt;
|
||||||
window.addEventListener('beforeinstallprompt', (e) => {
|
window.addEventListener('beforeinstallprompt', (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
@ -574,6 +576,7 @@
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Service Worker Registration
|
||||||
if ('serviceWorker' in navigator) {
|
if ('serviceWorker' in navigator) {
|
||||||
window.addEventListener('load', () => {
|
window.addEventListener('load', () => {
|
||||||
navigator.serviceWorker.register('/instinct/service-worker.js').then((registration) => {
|
navigator.serviceWorker.register('/instinct/service-worker.js').then((registration) => {
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue