diff --git a/index.html b/index.html
index 446f50f..677e2d6 100644
--- a/index.html
+++ b/index.html
@@ -177,40 +177,18 @@
300, 600, 300, 500, 800, 550, 400, 300, 900, 500, 'spin again',
900, 'Bankrupt', 600, 400, 300
];
- const wheelSpinSpeedData = {
- '0':0.2523,//lose a turn
- '1':.2497,//800
- '2':.2471,//350
- '3':.2445,//450
- '4':.2418,//450
- '5':.2392,//300
- '6':.2366,//600
- '7':.2339,//5000
- '8':.2313,//300
- '9':.2287,//600
- '10':.2261,//300
- '11':.2235,//500
- '12':.2208,//800
- '13':.2182,//550
- '14':.2156,//400
- '15':.213,//300
- '16':.2104,//900
- '17':.2078,//500
- '18':.2052,//spin again
- '19':.2026,//900
- '20':.1999,//Bankrupt
- '21':.1973,//600
- '22':.1947,//400
- '23':.1921//300
- };
const canvas = document.getElementById('wheelCanvas');
const ctx = canvas.getContext('2d');
const radius = canvas.width / 2;
-
- let rotation = 0 - (.283*6); //sets the zero index on top
+ let lowestEquivelantAngle = 23.4327090939438 % (2* Math.PI);
+ let fps = 60;
+ const frameDuration = 1000 / fps; // Duration of each frame in milliseconds
+ console.log('lowestEquivelantAngle:',lowestEquivelantAngle);
+ let rotation = lowestEquivelantAngle; //sets the zero index on top
let spinning = false;
- let spinSpeed = 0;
+
+
let img = new Image();
img.src = "arrow-down-bold.png";
img.onload = function() {
@@ -219,16 +197,13 @@
// Draw the wheel
function drawWheel(drawResult = false) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-
ctx.save();
-
ctx.translate(radius, radius);
ctx.rotate(rotation);
const anglePerSegment = (2 * Math.PI) / wheel.length;
-
+ console.log('',anglePerSegment)
wheel.forEach((value, i) => {
const startAngle = i * anglePerSegment;
const endAngle = startAngle + anglePerSegment;
@@ -263,53 +238,59 @@
// Start spinning
function startSpin(targetIndex) {
- console.log('targetIndex: ',targetIndex);
- let resultingSpeed = wheelSpinSpeedData[targetIndex[0]];
- console.log('resultingSpeed: ', resultingSpeed);
if (spinning) return;
+ const totalTime = 8;
+ let c = 1.62;
+ const totalSpins = 2
+ const anglePerSegment = (2 * Math.PI) / wheel.length;
+
rotation = 0 - (.283*6)
+ let finalDisplacement = (targetIndex[0] * anglePerSegment) - ((2 * Math.PI)*totalSpins);
+ if (targetIndex[0] != 0) {
+ finalDisplacement = ((targetIndex[0] * anglePerSegment)*-1 ) - ((2 * Math.PI)*totalSpins)
+ }
+
+ console.log('finalDisplacement',finalDisplacement);
+ const timeStep = 1 / fps; // seconds per frame
+ const totalFrames = totalTime * fps;
+ const k = finalDisplacement / Math.log(totalTime + c ); // Calculate `k` for deceleration
+ let currentFrame = 0;
+ let currentAngle = 0;
spinning = true;
- const totalSpins = Math.floor(Math.random() * 3) + 3; // 3-6 full spins
- const anglePerSegment = (2 * Math.PI) / wheel.length;
- const targetAngle = targetIndex * anglePerSegment;
console.log(anglePerSegment);
let currentRotation = rotation; // Start from the current rotation
- spinSpeed = wheelSpinSpeedData[targetIndex[0]]; // Initial speed
- function animate() {
- if ( spinSpeed < 0.001) {
+ function animate(timestamp) {
+
+ if (currentFrame > totalFrames) {
spinning = false;
spinSpeed = 0;
console.log(`Landed on: ${wheel[targetIndex[0]]}`);
+ console.log(`final frameCount: ${currentFrame} and totalFrames ${totalFrames}`);
+ console.log(`final rotation: ${rotation}`);
return;
}
- // console.log('currentRotation: ',currentRotation);
- // console.log('spinSpeed: ', spinSpeed);
- currentRotation += spinSpeed;
- spinSpeed *= 0.99; // Gradual slowdown
+ const t = currentFrame * timeStep;
- rotation = currentRotation ;
+ // Logarithmic deceleration velocity: v(t) = k * (1 - ln(t + 1) / ln(T + 1))
+ const velocity = k * (1 - Math.log(t + c) / Math.log(totalTime + c));
+ // Update the angle using the velocity
+ rotation += velocity * timeStep;
+
+ // Increment frame
+ currentFrame++;
drawWheel();
+ // frameCount++;
requestAnimationFrame(animate);
}
animate();
}
- // Simulate WebSocket server response
- // function simulateServerResponse() {
- // const targetIndex = Math.floor(Math.random() * wheel.length); // Random result
- // startSpin(targetIndex);
- // }
-
// Initial draw
drawWheel();
-
- // Trigger spin after 2 seconds
- //setTimeout(simulateServerResponse, 2000);
-
//==================================end of Wheel=====================================//
function drawPlayers(message) {
console.log(message);
@@ -536,7 +517,7 @@
//if there is multiple entries where the spin exists pick a random index.
if(filterResultsArr.length > 1) {
console.log('if fra.length > 1',filterResultsArr[0])
- startSpin(filterResultsArr[0][0]);
+ startSpin(filterResultsArr[0]);
}
else{
console.log('else',filterResultsArr[0])
diff --git a/server.js b/server.js
index 22c7d22..7d36a62 100644
--- a/server.js
+++ b/server.js
@@ -6,12 +6,12 @@ const crypto = require('crypto')
const wss = new WebSocket.Server({ port: 8080 })
const rooms = {} // Stores rooms and their clients
-// const wheel = [
-// 'lose a turn',800,350,450,700,300,600,5000,
-// 300,600,300,500,800,550,400,300,900,500,'spin again',
-// 900,'Bankrupt',600,400,300
-// ] //represents wheel in wheel of fortune game.
-const wheel = ['spin again','Bankrupt','lose a turn']
+const wheel = [
+ 'lose a turn',800,350,450,700,300,600,5000,
+ 300,600,300,500,800,550,400,300,900,500,'spin again',
+ 900,'Bankrupt',600,400,300
+] //represents wheel in wheel of fortune game.
+//const wheel = ['spin again','Bankrupt','lose a turn']
function removeProp(obj, prop) {
obj = JSON.parse(JSON.stringify(obj))
if(!Array.isArray(prop)){