This commit is contained in:
Omar Najjar 2024-07-07 18:27:01 +10:00 committed by GitHub
parent 02432766f8
commit 732d463b82
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -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) => {