Design a premium, cinematic “Double Spin Loot Box” feature module for an online sweepstakes casino platform called Nioplay.
97e45ce
verified
| document.addEventListener('DOMContentLoaded', function() { | |
| const spinButton = document.getElementById('spinButton'); | |
| const statusDisplay = document.getElementById('statusDisplay'); | |
| const resultPanel = document.getElementById('resultPanel'); | |
| // Simulate spin animation | |
| spinButton.addEventListener('click', function() { | |
| // Disable button during spin | |
| spinButton.disabled = true; | |
| statusDisplay.textContent = "Rolling..."; | |
| // Trigger loot box and multiplier animations | |
| const lootBoxComponent = document.querySelector('custom-lootbox'); | |
| const multiplierComponent = document.querySelector('custom-multiplier'); | |
| if (lootBoxComponent && multiplierComponent) { | |
| lootBoxComponent.startSpin(); | |
| multiplierComponent.startSpin(); | |
| // Simulate spin completion | |
| setTimeout(() => { | |
| lootBoxComponent.stopSpin(); | |
| // Second spin starts after first completes | |
| setTimeout(() => { | |
| multiplierComponent.stopSpin(); | |
| // Show results | |
| setTimeout(() => { | |
| resultPanel.style.opacity = '1'; | |
| statusDisplay.textContent = "Landed on: EPIC BOX"; | |
| spinButton.disabled = false; | |
| }, 500); | |
| }, 1000); | |
| }, 3000); | |
| } | |
| }); | |
| // Initialize feather icons | |
| feather.replace(); | |
| }); |