שגיאה בטעינת התלת מימד. עובר למצב 2D...

🎰 רולטה תלת מימדית 🎰

חוויה קזינו פרימיום

📊 סטטיסטיקות

סיבובים: 0
מספר אחרון: -
רצף אדומים: 0
רצף שחורים: 0
d('canvas-container').appendChild(this.renderer.domElement); this.wheelGroup = new THREE.Group(); this.ballGroup = new THREE.Group(); this.currentCameraMode = 'free'; this.cameraAngle = 0; this.wheelRotation = 0; this.ballAngle = 0; this.ballRadius = 4; this.ballHeight = 0.5; this.setup3DScene(); this.create3DRoulette(); this.create3DBall(); this.setup3DLights(); this.setup3DCamera(); this.animate3D(); console.log('✅ רולטה תלת מימדית הופעלה'); } catch (error) { console.error('❌ שגיאה ביצירת רולטה תלת מימדית:', error); throw error; } } setup3DScene() { this.scene.fog = new THREE.Fog(0x000000, 20, 100); window.addEventListener('resize', () => this.onWindowResize()); } setup3DLights() { // Ambient light const ambientLight = new THREE.AmbientLight(0x404040, 0.4); this.scene.add(ambientLight); // Main spotlight const spotLight = new THREE.SpotLight(0xffffff, 2); spotLight.position.set(0, 15, 0); spotLight.castShadow = true; spotLight.shadow.mapSize.width = 1024; spotLight.shadow.mapSize.height = 1024; this.scene.add(spotLight); // Colored rim lights const rimLight1 = new THREE.DirectionalLight(0xff6b6b, 0.6); rimLight1.position.set(10, 5, 10); this.scene.add(rimLight1); const rimLight2 = new THREE.DirectionalLight(0x4ecdc4, 0.6); rimLight2.position.set(-10, 5, -10); this.scene.add(rimLight2); } create3DRoulette() { // Base const baseGeometry = new THREE.CylinderGeometry(6, 6.5, 0.5, 32); const baseMaterial = new THREE.MeshPhongMaterial({ color: 0x1a1a1a }); const base = new THREE.Mesh(baseGeometry, baseMaterial); base.position.y = -0.25; base.receiveShadow = true; this.wheelGroup.add(base); // Rim const rimGeometry = new THREE.CylinderGeometry(5.5, 5.5, 0.3, 32); const rimMaterial = new THREE.MeshPhongMaterial({ color: 0xffd700 }); const rim = new THREE.Mesh(rimGeometry, rimMaterial); rim.position.y = 0.15; rim.castShadow = true; this.wheelGroup.add(rim); // Sectors this.create3DSectors(); // Center const hubGeometry = new THREE.CylinderGeometry(0.3, 0.3, 0.4, 16); const hubMaterial = new THREE.MeshPhongMaterial({ color: 0xffd700 }); const hub = new THREE.Mesh(hubGeometry, hubMaterial); hub.position.y = 0.2; this.wheelGroup.add(hub); this.scene.add(this.wheelGroup); } create3DSectors() { const sectorAngle = (Math.PI * 2) / this.numbers.length; this.numbers.forEach((number, index) => { const angle = index * sectorAngle; let color; if (number === 0) color = 0x00aa00; else if ([1,3,5,7,9,12,14,16,18,19,21,23,25,27,30,32,34,36].includes(number)) color = 0xcc0000; else color = 0x333333; const sectorGeometry = new THREE.CylinderGeometry(5, 5, 0.1, 16, 1, false, angle - sectorAngle/2, sectorAngle); const sectorMaterial = new THREE.MeshPhongMaterial({ color: color }); const sector = new THREE.Mesh(sectorGeometry, sectorMaterial); sector.position.y = 0.05; this.wheelGroup.add(sector); }); } create3DBall() { const ballGeometry = new THREE.SphereGeometry(0.08, 16, 16); const ballMaterial = new THREE.MeshPhongMaterial({ color: 0xffffff, shininess: 100 }); this.ball = new THREE.Mesh(ballGeometry, ballMaterial); this.ball.castShadow = true; this.ballGroup.add(this.ball); this.scene.add(this.ballGroup); this.update3DBallPosition(); } update3DBallPosition() { const x = Math.cos(this.ballAngle) * this.ballRadius; const z = Math.sin(this.ballAngle) * this.ballRadius; this.ball.position.set(x, this.ballHeight, z); } setup3DCamera() { this.set3DCameraMode('free'); } set3DCameraMode(mode) { this.currentCameraMode = mode; switch(mode) { case 'top': this.camera.position.set(0, 12, 0); this.camera.lookAt(0, 0, 0); break; case 'side': this.camera.position.set(10, 5, 0); this.camera.lookAt(0, 0, 0); break; case 'free': this.camera.position.set(8, 8, 8); this.camera.lookAt(0, 0, 0); break; } } animate3D() { requestAnimationFrame(() => this.animate3D()); // Camera movement in free mode if (this.currentCameraMode === 'free' && !this.isSpinning) { this.cameraAngle += 0.005; this.camera.position.x = Math.cos(this.cameraAngle) * 10; this.camera.position.z = Math.sin(this.cameraAngle) * 10; this.camera.position.y = 8 + Math.sin(this.cameraAngle * 0.5) * 1; this.camera.lookAt(0, 0, 0); } // Idle wheel rotation if (!this.isSpinning) { this.wheelGroup.rotation.y += 0.002; } this.renderer.render(this.scene, this.camera); } onWindowResize() { if (this.camera && this.renderer) { this.camera.aspect = window.innerWidth / window.innerHeight; this.camera.updateProjectionMatrix(); this.renderer.setSize(window.innerWidth, window.innerHeight); } } // Fallback 2D Version init2DRoulette() { this.fallbackMode = true; console.log('🎨 מפעיל מצב 2D...'); const canvas = document.createElement('canvas'); canvas.width = window.innerWidth; canvas.height = window.innerHeight; canvas.style.position = 'absolute'; canvas.style.top = '0'; canvas.style.left = '0'; canvas.style.zIndex = '1'; document.getElementById('canvas-container').appendChild(canvas); this.ctx = canvas.getContext('2d'); this.wheelRotation = 0; this.ballAngle = 0; this.animate2D(); window.addEventListener('resize', () => { canvas.width = window.innerWidth; canvas.height = window.innerHeight; }); } animate2D() { requestAnimationFrame(() => this.animate2D()); this.ctx.clearRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height); const centerX = this.ctx.canvas.width / 2; const centerY = this.ctx.canvas.height / 2; const radius = Math.min(centerX, centerY) * 0.4; // Draw wheel this.ctx.save(); this.ctx.translate(centerX, centerY); this.ctx.rotate(this.wheelRotation); // Draw sectors const sectorAngle = (Math.PI * 2) / this.numbers.length; this.numbers.forEach((number, index) => { const angle = index * sectorAngle; this.ctx.beginPath(); this.ctx.arc(0, 0, radius, angle - sectorAngle/2, angle + sectorAngle/2); this.ctx.lineTo(0, 0); if (number === 0) this.ctx.fillStyle = '#00aa00'; else if ([1,3,5,7,9,12,14,16,18,19,21,23,25,27,30,32,34,36].includes(number)) this.ctx.fillStyle = '#cc0000'; else this.ctx.fillStyle = '#333333'; this.ctx.fill(); this.ctx.strokeStyle = '#ffd700'; this.ctx.lineWidth = 2; this.ctx.stroke(); // Draw numbers this.ctx.save(); this.ctx.rotate(angle); this.ctx.translate(radius * 0.8, 0); this.ctx.rotate(-angle - this.wheelRotation); this.ctx.fillStyle = 'white'; this.ctx.font = '16px Arial'; this.ctx.textAlign = 'center'; this.ctx.fillText(number.toString(), 0, 5); this.ctx.restore(); }); this.ctx.restore(); // Draw ball const ballX = centerX + Math.cos(this.ballAngle) * radius * 0.9; const ballY = centerY + Math.sin(this.ballAngle) * radius * 0.9; this.ctx.beginPath(); this.ctx.arc(ballX, ballY, 8, 0, Math.PI * 2); this.ctx.fillStyle = 'white'; this.ctx.fill(); this.ctx.strokeStyle = '#ccc'; this.ctx.lineWidth = 2; this.ctx.stroke(); // Idle rotation if (!this.isSpinning) { this.wheelRotation += 0.005; } } setupControls() { document.getElementById('spinButton').addEventListener('click', () => this.spin()); if (this.threejsLoaded) { document.getElementById('topViewBtn').addEventListener('click', () => this.set3DCameraMode('top')); document.getElementById('sideViewBtn').addEventListener('click', () => this.set3DCameraMode('side')); document.getElementById('freeViewBtn').addEventListener('click', () => this.set3DCameraMode('free')); } else { // Hide 3D camera controls in 2D mode document.querySelector('.camera-controls').style.display = 'none'; } } spin() { if (this.isSpinning) return; this.isSpinning = true; document.getElementById('spinButton').disabled = true; document.getElementById('resultDisplay').innerHTML = ''; console.log('🎲 מתחיל סיבוב...'); const spinDuration = 4000; const wheelSpins = 5 + Math.random() * 5; const ballSpins = 8 + Math.random() * 4; const startTime = Date.now(); const animate = () => { const elapsed = Date.now() - startTime; const progress = Math.min(elapsed / spinDuration, 1); const easing = 1 - Math.pow(1 - progress, 3); this.wheelRotation = wheelSpins * Math.PI * 2 * easing; this.ballAngle = -ballSpins * Math.PI * 2 * easing; if (this.threejsLoaded) { this.wheelGroup.rotation.y = this.wheelRotation; this.ballRadius = 4 - 0.5 * easing; this.ballHeight = 0.5 + 0.2 * Math.sin(progress * Math.PI); this.update3DBallPosition(); } if (progress < 1) { requestAnimationFrame(animate); } else { this.finishSpin(); } }; animate(); } finishSpin() { const normalizedRotation = (Math.PI * 2 - (this.wheelRotation % (Math.PI * 2))) % (Math.PI * 2); const sectorAngle = (Math.PI * 2) / this.numbers.length; const winningIndex = Math.floor(normalizedRotation / sectorAngle); const winningNumber = this.numbers[winningIndex]; console.log('🎯 מספר זוכה:', winningNumber); if (this.threejsLoaded) { this.ballRadius = 4.2; this.ballHeight = 0.5; this.update3DBallPosition(); } this.showResult(winningNumber); this.updateStats(winningNumber); this.isSpinning = false; document.getElementById('spinButton').disabled = false; } showResult(number) { const colorClass = number === 0 ? 'green' : ([1,3,5,7,9,12,14,16,18,19,21,23,25,27,30,32,34,36].includes(number) ? 'red' : 'black'); document.getElementById('resultDisplay').innerHTML = `
🎯 המספר הזוכה: ${number} ${this.getNumberEmoji(number, colorClass)}
`; } getNumberEmoji(number, color) { if (number === 0) return '💚'; return color === 'red' ? '🔴' : '⚫'; } updateStats(number) { this.spinCount++; this.lastNumber = number; if (number === 0) { this.redStreak = 0; this.blackStreak = 0; } else if ([1,3,5,7,9,12,14,16,18,19,21,23,25,27,30,32,34,36].includes(number)) { this.redStreak++; this.blackStreak = 0; } else { this.blackStreak++; this.redStreak = 0; } document.getElementByI