Pong Game

\n \n

\n Player: 0 | Computer: 0\n

\n \n

\n Press SPACE to start\n

\n \n

Use ↑ and ↓ arrow keys to move your paddle

Press SPACE to start/restart the game

\n \n \n\n",[],[86,132],"54a30fbc-1a3f-11f0-a2d9-569c3dd06744","game.ts","aed31c24-40de-4ff2-b963-a70f120f848d",["D",1744751975330],"// // Game constants\n// const PADDLE_HEIGHT = 100;\n// const PADDLE_WIDTH = 15;\n// const PADDLE_SPEED = 8;\n// const BALL_RADIUS = 10;\n// const BALL_SPEED_INITIAL = 5;\n// const BALL_SPEED_INCREMENT = 0.2;\n// const MAX_SCORE = 10;\n\n// // Game state interfaces\n// interface GameState {\n// player: Paddle;\n// computer: Paddle;\n// ball: Ball;\n// playerScore: number;\n// computerScore: number;\n// isRunning: boolean;\n// keys: { [key: string]: boolean };\n// difficulty: number;\n// }\n\n// interface Paddle {\n// x: number;\n// y: number;\n// width: number;\n// height: number;\n// speed: number;\n// }\n\n// interface Ball {\n// x: number;\n// y: number;\n// radius: number;\n// velocityX: number;\n// velocityY: number;\n// speed: number;\n// }\n\n// export class PongGame {\n// private canvas: HTMLCanvasElement;\n// private ctx: CanvasRenderingContext2D;\n// private state: GameState;\n// private scoreDisplay: HTMLElement;\n// private gameMessage: HTMLElement;\n// private animationFrameId: number | null = null;\n\n// constructor(canvasId: string) {\n// // Get canvas and context\n// this.canvas = document.getElementById(canvasId) as HTMLCanvasElement;\n// this.ctx = this.canvas.getContext('2d') as CanvasRenderingContext2D;\n \n// // Get DOM elements\n// this.scoreDisplay = document.getElementById('scoreDisplay') as HTMLElement;\n// this.gameMessage = document.getElementById('gameMessage') as HTMLElement;\n \n// // Initialize game state\n// this.state = this.getInitialState();\n \n// // Set up event listeners\n// this.setupEventListeners();\n \n// // Show start message\n// this.showMessage('Press SPACE to start');\n \n// // Start game loop\n// this.gameLoop();\n// }\n\n// private getInitialState(): GameState {\n// return {\n// player: {\n// x: 50,\n// y: this.canvas.height / 2 - PADDLE_HEIGHT / 2,\n// width: PADDLE_WIDTH,\n// height: PADDLE_HEIGHT,\n// speed: PADDLE_SPEED\n// },\n// computer: {\n// x: this.canvas.width - 50 - PADDLE_WIDTH,\n// y: this.canvas.height / 2 - PADDLE_HEIGHT / 2,\n// width: PADDLE_WIDTH,\n// height: PADDLE_HEIGHT,\n// speed: PADDLE_SPEED * 0.7 // Computer is slightly slower for fairness\n// },\n// ball: {\n// x: this.canvas.width / 2,\n// y: this.canvas.height / 2,\n// radius: BALL_RADIUS,\n// velocityX: BALL_SPEED_INITIAL,\n// velocityY: BALL_SPEED_INITIAL * (Math.random() > 0.5 ? 1 : -1),\n// speed: BALL_SPEED_INITIAL\n// },\n// playerScore: 0,\n// computerScore: 0,\n// isRunning: false,\n// keys: {},\n// difficulty: 0.85 // AI difficulty (0-1)\n// };\n// }\n\n// private setupEventListeners(): void {\n// // Keyboard event listeners\n// window.addEventListener('keydown', (e) => {\n// this.state.keys[e.key] = true;\n \n// // Start/restart game with spacebar\n// if (e.key === ' ' && !this.state.isRunning) {\n// this.startGame();\n// }\n// });\n \n// window.addEventListener('keyup', (e) => {\n// this.state.keys[e.key] = false;\n// });\n// }\n\n// private startGame(): void {\n// // Reset ball position and set random direction\n// this.state.ball.x = this.canvas.width / 2;\n// this.state.ball.y = this.canvas.height / 2;\n// this.state.ball.speed = BALL_SPEED_INITIAL;\n \n// // Random X direction (towards player or computer)\n// this.state.ball.velocityX = BALL_SPEED_INITIAL * (Math.random() > 0.5 ? 1 : -1);\n \n// // Random Y direction (up or down)\n// this.state.ball.velocityY = BALL_SPEED_INITIAL * (Math.random() > 0.5 ? 1 : -1);\n \n// // Start the game\n// this.state.isRunning = true;\n// this.hideMessage();\n// }\n\n// private resetGame(): void {\n// this.state = this.getInitialState();\n// this.updateScoreDisplay();\n// this.showMessage('Press SPACE to start');\n// }\n\n// private showMessage(text: string): void {\n// this.gameMessage.textContent = text;\n// this.gameMessage.classList.remove('hidden');\n// }\n\n// private hideMessage(): void {\n// this.gameMessage.classList.add('hidden');\n// }\n\n// private updateScoreDisplay(): void {\n// this.scoreDisplay.textContent = `Player: ${this.state.playerScore} | Computer: ${this.state.computerScore}`;\n// }\n\n// private gameLoop(): void {\n// // Clear canvas\n// this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);\n \n// // Update game state\n// if (this.state.isRunning) {\n// this.update();\n// }\n \n// // Render game objects\n// this.render();\n \n// // Continue game loop\n// this.animationFrameId = requestAnimationFrame(() => this.gameLoop());\n// }\n\n// private update(): void {\n// // Move player paddle based on keyboard input\n// if (this.state.keys['ArrowUp']) {\n// this.state.player.y = Math.max(0, this.state.player.y - this.state.player.speed);\n// }\n \n// if (this.state.keys['ArrowDown']) {\n// this.state.player.y = Math.min(\n// this.canvas.height - this.state.player.height,\n// this.state.player.y + this.state.player.speed\n// );\n// }\n \n// // Move computer paddle (simple AI)\n// this.moveComputerPaddle();\n \n// // Move ball\n// this.state.ball.x += this.state.ball.velocityX;\n// this.state.ball.y += this.state.ball.velocityY;\n \n// // Ball collision with top and bottom walls\n// if (\n// this.state.ball.y + this.state.ball.radius > this.canvas.height ||\n// this.state.ball.y - this.state.ball.radius < 0\n// ) {\n// this.state.ball.velocityY = -this.state.ball.velocityY;\n \n// // Add a little randomness to the bounce\n// this.state.ball.velocityY += (Math.random() * 2 - 1) * 0.2;\n// }\n \n// // Determine which paddle to check for collision\n// const paddle = this.state.ball.velocityX < 0 ? this.state.player : this.state.computer;\n \n// // Check for paddle collision\n// if (this.checkPaddleCollision(paddle)) {\n// // Reverse ball direction\n// this.state.ball.velocityX = -this.state.ball.velocityX;\n \n// // Increase ball speed\n// this.state.ball.speed += BALL_SPEED_INCREMENT;\n \n// // Calculate new velocity based on where the ball hit the paddle\n// const collisionPoint = (this.state.ball.y - (paddle.y + paddle.height / 2)) / (paddle.height / 2);\n \n// // Calculate angle and set new velocities\n// const angle = collisionPoint * (Math.PI / 4); // Max 45 degree angle\n// const direction = this.state.ball.velocityX > 0 ? -1 : 1;\n \n// this.state.ball.velocityX = direction * this.state.ball.speed * Math.cos(angle);\n// this.state.ball.velocityY = this.state.ball.speed * Math.sin(angle);\n// }\n \n// // Check if ball goes out of bounds (scoring)\n// if (this.state.ball.x + this.state.ball.radius < 0) {\n// // Computer scores\n// this.state.computerScore++;\n// this.updateScoreDisplay();\n// this.checkWinCondition();\n// } else if (this.state.ball.x - this.state.ball.radius > this.canvas.width) {\n// // Player scores\n// this.state.playerScore++;\n// this.updateScoreDisplay();\n// this.checkWinCondition();\n// }\n// }\n\n// private checkPaddleCollision(paddle: Paddle): boolean {\n// return (\n// this.state.ball.x + this.state.ball.radius > paddle.x &&\n// this.state.ball.x - this.state.ball.radius < paddle.x + paddle.width &&\n// this.state.ball.y + this.state.ball.radius > paddle.y &&\n// this.state.ball.y - this.state.ball.radius < paddle.y + paddle.height\n// );\n// }\n\n// private moveComputerPaddle(): void {\n// // Simple AI: Move towards the ball with some delay based on difficulty\n// const computerCenter = this.state.computer.y + this.state.computer.height / 2;\n \n// // Only move if the ball is moving towards the computer\n// if (this.state.ball.velocityX > 0) {\n// // Predict where the ball will be\n// const predictedY = this.predictBallY();\n \n// // Move towards the predicted position with some randomness\n// if (computerCenter < predictedY - 10) {\n// this.state.computer.y += this.state.computer.speed * this.state.difficulty;\n// } else if (computerCenter > predictedY + 10) {\n// this.state.computer.y -= this.state.computer.speed * this.state.difficulty;\n// }\n \n// // Ensure paddle stays within bounds\n// this.state.computer.y = Math.max(\n// 0,\n// Math.min(this.canvas.height - this.state.computer.height, this.state.computer.y)\n// );\n// }\n// }\n\n// private predictBallY(): number {\n// // Simple prediction of where the ball will be when it reaches the computer's x position\n// if (this.state.ball.velocityX <= 0) return this.canvas.height / 2;\n \n// // Calculate how many steps until the ball reaches the computer's x position\n// const distanceX = this.state.computer.x - this.state.ball.x;\n// const steps = distanceX / this.state.ball.velocityX;\n \n// // Predict y position\n// let predictedY = this.state.ball.y + this.state.ball.velocityY * steps;\n \n// // Account for bounces\n// const bounceHeight = this.canvas.height - this.state.ball.radius;\n \n// // Simplistic bounce prediction\n// while (predictedY < 0 || predictedY > bounceHeight) {\n// if (predictedY < 0) {\n// predictedY = -predictedY;\n// } else if (predictedY > bounceHeight) {\n// predictedY = 2 * bounceHeight - predictedY;\n// }\n// }\n \n// return predictedY;\n// }\n\n// private checkWinCondition(): void {\n// if (this.state.playerScore >= MAX_SCORE) {\n// this.state.isRunning = false;\n// this.showMessage('You Win! Press SPACE to restart');\n// } else if (this.state.computerScore >= MAX_SCORE) {\n// this.state.isRunning = false;\n// this.showMessage('Computer Wins! Press SPACE to restart');\n// } else {\n// // Continue game with a new ball\n// this.state.isRunning = false;\n// this.showMessage('Press SPACE to continue');\n// }\n// }\n\n// private render(): void {\n// // Set canvas styling\n// this.ctx.fillStyle = '#000';\n// this.ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);\n \n// // Draw center line\n// this.ctx.beginPath();\n// this.ctx.setLineDash([10, 15]);\n// this.ctx.moveTo(this.canvas.width / 2, 0);\n// this.ctx.lineTo(this.canvas.width / 2, this.canvas.height);\n// this.ctx.strokeStyle = 'rgba(255, 255, 255, 0.5)';\n// this.ctx.lineWidth = 2;\n// this.ctx.stroke();\n// this.ctx.setLineDash([]);\n \n// // Draw paddles\n// this.ctx.fillStyle = '#fff';\n \n// // Player paddle\n// this.ctx.fillRect(\n// this.state.player.x,\n// this.state.player.y,\n// this.state.player.width,\n// this.state.player.height\n// );\n \n// // Computer paddle\n// this.ctx.fillRect(\n// this.state.computer.x,\n// this.state.computer.y,\n// this.state.computer.width,\n// this.state.computer.height\n// );\n \n// // Draw ball\n// this.ctx.beginPath();\n// this.ctx.arc(\n// this.state.ball.x,\n// this.state.ball.y,\n// this.state.ball.radius,\n// 0,\n// Math.PI * 2\n// );\n// this.ctx.fill();\n// }\n\n// // Public method to clean up resources\n// public destroy(): void {\n// if (this.animationFrameId) {\n// cancelAnimationFrame(this.animationFrameId);\n// }\n \n// // Remove event listeners if needed\n// window.removeEventListener('keydown', () => {});\n// window.removeEventListener('keyup', () => {});\n// }\n// }",[],[86,139],"54a2e2c6-1a3f-11f0-a2d9-569c3dd06744","game.js","738a7eb0-dd95-4aec-87ad-66cd2634bc57",["D",1744751975330],"// Game constants\nconst PADDLE_HEIGHT = 100;\nconst PADDLE_WIDTH = 15;\nconst PADDLE_SPEED = 8;\nconst BALL_RADIUS = 10;\nconst BALL_SPEED_INITIAL = 5;\nconst BALL_SPEED_INCREMENT = 0.2;\nconst MAX_SCORE = 10;\n\nexport class PongGame {\n constructor(canvasId) {\n // Get canvas and context\n this.canvas = document.getElementById(canvasId);\n this.ctx = this.canvas.getContext('2d');\n \n // Get DOM elements\n this.scoreDisplay = document.getElementById('scoreDisplay');\n this.gameMessage = document.getElementById('gameMessage');\n \n // Initialize game state\n this.state = this.getInitialState();\n \n // Set up event listeners\n this.setupEventListeners();\n \n // Show start message\n this.showMessage('Press SPACE to start');\n \n // Start game loop\n this.gameLoop();\n \n // Animation frame ID for cleanup\n this.animationFrameId = null;\n }\n\n getInitialState() {\n return {\n player: {\n x: 50,\n y: this.canvas.height / 2 - PADDLE_HEIGHT / 2,\n width: PADDLE_WIDTH,\n height: PADDLE_HEIGHT,\n speed: PADDLE_SPEED\n },\n computer: {\n x: this.canvas.width - 50 - PADDLE_WIDTH,\n y: this.canvas.height / 2 - PADDLE_HEIGHT / 2,\n width: PADDLE_WIDTH,\n height: PADDLE_HEIGHT,\n speed: PADDLE_SPEED * 0.7 // Computer is slightly slower for fairness\n },\n ball: {\n x: this.canvas.width / 2,\n y: this.canvas.height / 2,\n radius: BALL_RADIUS,\n velocityX: BALL_SPEED_INITIAL,\n velocityY: BALL_SPEED_INITIAL * (Math.random() > 0.5 ? 1 : -1),\n speed: BALL_SPEED_INITIAL\n },\n playerScore: 0,\n computerScore: 0,\n isRunning: false,\n keys: {},\n difficulty: 0.85 // AI difficulty (0-1)\n };\n }\n\n setupEventListeners() {\n // Keyboard event listeners\n window.addEventListener('keydown', (e) => {\n this.state.keys[e.key] = true;\n \n // Start/restart game with spacebar\n if (e.key === ' ' && !this.state.isRunning) {\n this.startGame();\n }\n });\n \n window.addEventListener('keyup', (e) => {\n this.state.keys[e.key] = false;\n });\n }\n\n startGame() {\n // Reset ball position and set random direction\n this.state.ball.x = this.canvas.width / 2;\n this.state.ball.y = this.canvas.height / 2;\n this.state.ball.speed = BALL_SPEED_INITIAL;\n \n // Random X direction (towards player or computer)\n this.state.ball.velocityX = BALL_SPEED_INITIAL * (Math.random() > 0.5 ? 1 : -1);\n \n // Random Y direction (up or down)\n this.state.ball.velocityY = BALL_SPEED_INITIAL * (Math.random() > 0.5 ? 1 : -1);\n \n // Start the game\n this.state.isRunning = true;\n this.hideMessage();\n }\n\n resetGame() {\n this.state = this.getInitialState();\n this.updateScoreDisplay();\n this.showMessage('Press SPACE to start');\n }\n\n showMessage(text) {\n this.gameMessage.textContent = text;\n this.gameMessage.classList.remove('hidden');\n }\n\n hideMessage() {\n this.gameMessage.classList.add('hidden');\n }\n\n updateScoreDisplay() {\n this.scoreDisplay.textContent = `Player: ${this.state.playerScore} | Computer: ${this.state.computerScore}`;\n }\n\n gameLoop() {\n // Clear canvas\n this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);\n \n // Update game state\n if (this.state.isRunning) {\n this.update();\n }\n \n // Render game objects\n this.render();\n \n // Continue game loop\n this.animationFrameId = requestAnimationFrame(() => this.gameLoop());\n }\n\n update() {\n // Move player paddle based on keyboard input\n if (this.state.keys['ArrowUp']) {\n this.state.player.y = Math.max(0, this.state.player.y - this.state.player.speed);\n }\n \n if (this.state.keys['ArrowDown']) {\n this.state.player.y = Math.min(\n this.canvas.height - this.state.player.height,\n this.state.player.y + this.state.player.speed\n );\n }\n \n // Move computer paddle (simple AI)\n this.moveComputerPaddle();\n \n // Move ball\n this.state.ball.x += this.state.ball.velocityX;\n this.state.ball.y += this.state.ball.velocityY;\n \n // Ball collision with top and bottom walls\n if (\n this.state.ball.y + this.state.ball.radius > this.canvas.height ||\n this.state.ball.y - this.state.ball.radius < 0\n ) {\n this.state.ball.velocityY = -this.state.ball.velocityY;\n \n // Add a little randomness to the bounce\n this.state.ball.velocityY += (Math.random() * 2 - 1) * 0.2;\n }\n \n // Check for collision with player paddle\n if (this.checkPaddleCollision(this.state.player)) {\n // Only handle collision if the ball is moving toward the player (left)\n if (this.state.ball.velocityX < 0) {\n // Reverse ball direction\n this.state.ball.velocityX = -this.state.ball.velocityX;\n \n // Increase ball speed\n this.state.ball.speed += BALL_SPEED_INCREMENT;\n \n // Calculate new velocity based on where the ball hit the paddle\n const collisionPoint = (this.state.ball.y - (this.state.player.y + this.state.player.height / 2)) / (this.state.player.height / 2);\n \n // Calculate angle and set new velocities\n const angle = collisionPoint * (Math.PI / 4); // Max 45 degree angle\n this.state.ball.velocityX = this.state.ball.speed * Math.cos(angle);\n this.state.ball.velocityY = this.state.ball.speed * Math.sin(angle);\n }\n }\n \n // Check for collision with computer paddle\n if (this.checkPaddleCollision(this.state.computer)) {\n // Only handle collision if the ball is moving toward the computer (right)\n if (this.state.ball.velocityX > 0) {\n // Reverse ball direction\n this.state.ball.velocityX = -this.state.ball.velocityX;\n \n // Increase ball speed\n this.state.ball.speed += BALL_SPEED_INCREMENT;\n \n // Calculate new velocity based on where the ball hit the paddle\n const collisionPoint = (this.state.ball.y - (this.state.computer.y + this.state.computer.height / 2)) / (this.state.computer.height / 2);\n \n // Calculate angle and set new velocities\n const angle = collisionPoint * (Math.PI / 4); // Max 45 degree angle\n this.state.ball.velocityX = -this.state.ball.speed * Math.cos(angle);\n this.state.ball.velocityY = this.state.ball.speed * Math.sin(angle);\n }\n }\n \n // Check if ball goes out of bounds (scoring)\n if (this.state.ball.x + this.state.ball.radius < 0) {\n // Computer scores\n this.state.computerScore++;\n this.updateScoreDisplay();\n this.checkWinCondition();\n } else if (this.state.ball.x - this.state.ball.radius > this.canvas.width) {\n // Player scores\n this.state.playerScore++;\n this.updateScoreDisplay();\n this.checkWinCondition();\n }\n }\n\n checkPaddleCollision(paddle) {\n return (\n this.state.ball.x + this.state.ball.radius > paddle.x &&\n this.state.ball.x - this.state.ball.radius < paddle.x + paddle.width &&\n this.state.ball.y + this.state.ball.radius > paddle.y &&\n this.state.ball.y - this.state.ball.radius < paddle.y + paddle.height\n );\n }\n\n moveComputerPaddle() {\n // Simple AI: Move towards the ball with some delay based on difficulty\n const computerCenter = this.state.computer.y + this.state.computer.height / 2;\n \n // Only move if the ball is moving towards the computer\n if (this.state.ball.velocityX > 0) {\n // Predict where the ball will be\n const predictedY = this.predictBallY();\n \n // Move towards the predicted position with some randomness\n if (computerCenter < predictedY - 10) {\n this.state.computer.y += this.state.computer.speed * this.state.difficulty;\n } else if (computerCenter > predictedY + 10) {\n this.state.computer.y -= this.state.computer.speed * this.state.difficulty;\n }\n \n // Ensure paddle stays within bounds\n this.state.computer.y = Math.max(\n 0,\n Math.min(this.canvas.height - this.state.computer.height, this.state.computer.y)\n );\n }\n }\n\n predictBallY() {\n // Simple prediction of where the ball will be when it reaches the computer's x position\n if (this.state.ball.velocityX <= 0) return this.canvas.height / 2;\n \n // Calculate how many steps until the ball reaches the computer's x position\n const distanceX = this.state.computer.x - this.state.ball.x;\n const steps = distanceX / this.state.ball.velocityX;\n \n // Predict y position\n let predictedY = this.state.ball.y + this.state.ball.velocityY * steps;\n \n // Account for bounces\n const bounceHeight = this.canvas.height - this.state.ball.radius;\n \n // Simplistic bounce prediction\n while (predictedY < 0 || predictedY > bounceHeight) {\n if (predictedY < 0) {\n predictedY = -predictedY;\n } else if (predictedY > bounceHeight) {\n predictedY = 2 * bounceHeight - predictedY;\n }\n }\n \n return predictedY;\n }\n\n checkWinCondition() {\n if (this.state.playerScore >= MAX_SCORE) {\n this.state.isRunning = false;\n this.showMessage('You Win! Press SPACE to restart');\n } else if (this.state.computerScore >= MAX_SCORE) {\n this.state.isRunning = false;\n this.showMessage('Computer Wins! Press SPACE to restart');\n } else {\n // Continue game with a new ball\n this.state.isRunning = false;\n this.showMessage('Press SPACE to continue');\n }\n }\n\n render() {\n // Set canvas styling\n this.ctx.fillStyle = '#000';\n this.ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);\n \n // Draw center line\n this.ctx.beginPath();\n this.ctx.setLineDash([10, 15]);\n this.ctx.moveTo(this.canvas.width / 2, 0);\n this.ctx.lineTo(this.canvas.width / 2, this.canvas.height);\n this.ctx.strokeStyle = 'rgba(255, 255, 255, 0.5)';\n this.ctx.lineWidth = 2;\n this.ctx.stroke();\n this.ctx.setLineDash([]);\n \n // Draw paddles\n this.ctx.fillStyle = '#fff';\n \n // Player paddle\n this.ctx.fillRect(\n this.state.player.x,\n this.state.player.y,\n this.state.player.width,\n this.state.player.height\n );\n \n // Computer paddle\n this.ctx.fillRect(\n this.state.computer.x,\n this.state.computer.y,\n this.state.computer.width,\n this.state.computer.height\n );\n \n // Draw ball\n this.ctx.beginPath();\n this.ctx.arc(\n this.state.ball.x,\n this.state.ball.y,\n this.state.ball.radius,\n 0,\n Math.PI * 2\n );\n this.ctx.fill();\n }\n\n // Public method to clean up resources\n destroy() {\n if (this.animationFrameId) {\n cancelAnimationFrame(this.animationFrameId);\n }\n \n // Remove event listeners if needed\n window.removeEventListener('keydown', () => {});\n window.removeEventListener('keyup', () => {});\n }\n}",[],[86,146],"549db88c-1a3f-11f0-a2d9-569c3dd06744",["D",1744751975330],"legacyEnvVars","httpPrivacy","description","imageUrl","userId","a8270e74-6479-475a-8025-9b69544ee0e7","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_193":189},"org",{"_11":12,"_187":-5,"_188":189,"_158":159,"_190":191,"_192":49},"branch",{"_17":68,"_13":16,"_34":66,"_40":152,"_43":35,"_44":42,"_184":51,"_185":41,"_186":54,"_55":14,"_52":12},"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","avatar","https://images.clerk.dev/oauth_github/img_2NnaHhpxNuH1xWRIRjQNoo16TVc.jpeg","tier","pro","canRestrictVals","profileImageUrl","adoptOrgId",{"_34":152,"_13":14,"_36":259,"_47":-5,"_154":49,"_50":51,"_155":51,"_156":-5,"_157":-5,"_158":159,"_160":63,"_161":70,"_162":-5,"_163":-5,"_164":31,"_53":54,"_165":-5,"_166":-5,"_167":-5,"_168":-5,"_169":170,"_171":170,"_172":173,"_174":173,"_175":173,"_176":170,"_177":170,"_178":260,"_180":261,"_182":262,"_48":49},[232,239,240],"files",[232,233,234,235,236,237,238,239,240],"counts",{"_223":31,"_224":68,"_225":68,"_33":226,"_227":228},[217,218,219],"upstreamProject",{"_34":41,"_13":56,"_156":-5,"_157":-5,"_50":51,"_178":216},"upstreamBranch",{"_34":35,"_36":214,"_38":215,"_13":16,"_40":41,"_17":42,"_43":-5,"_44":-5,"_45":46,"_47":-5,"_48":49,"_50":51,"_52":12,"_53":54,"_55":56},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1744612047755],["D",1744644736949],{"_11":12,"_193":189},{"_34":85,"_13":86,"_62":87,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":88,"_17":31,"_72":89,"_74":-5,"_76":49,"_77":-5,"_18":222},{"_34":79,"_13":80,"_62":81,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":82,"_17":31,"_72":24,"_74":83,"_76":49,"_77":-5,"_18":221},{"_34":60,"_13":61,"_62":63,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":71,"_17":31,"_72":73,"_74":75,"_76":49,"_77":-5,"_18":220},[61],[80],[86],"pulls","branches","forks",{"_229":31,"_231":31},"connections",{"_229":31,"_230":31},"count","unfilledCount","emptyCount",{"_34":85,"_13":86,"_62":87,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":101,"_17":31,"_72":89,"_74":-5,"_76":49,"_77":-5,"_95":257,"_18":258},{"_34":145,"_13":146,"_62":147,"_64":87,"_65":66,"_67":68,"_69":70,"_36":148,"_17":31,"_72":120,"_74":149,"_76":49,"_77":-5,"_95":255,"_18":256},{"_34":138,"_13":139,"_62":140,"_64":87,"_65":66,"_67":68,"_69":70,"_36":141,"_17":31,"_72":120,"_74":142,"_76":49,"_77":-5,"_95":253,"_18":254},{"_34":131,"_13":132,"_62":133,"_64":87,"_65":66,"_67":68,"_69":70,"_36":134,"_17":31,"_72":24,"_74":135,"_76":49,"_77":-5,"_95":251,"_18":252},{"_34":124,"_13":125,"_62":126,"_64":87,"_65":66,"_67":68,"_69":70,"_36":127,"_17":31,"_72":120,"_74":128,"_76":49,"_77":-5,"_95":249,"_18":250},{"_34":117,"_13":61,"_62":118,"_64":87,"_65":66,"_67":68,"_69":70,"_36":119,"_17":31,"_72":120,"_74":121,"_76":49,"_77":-5,"_95":247,"_18":248},{"_34":110,"_13":111,"_62":112,"_64":87,"_65":66,"_67":68,"_69":70,"_36":113,"_17":31,"_72":24,"_74":114,"_76":49,"_77":-5,"_95":245,"_18":246},{"_34":79,"_13":80,"_62":81,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":98,"_17":31,"_72":24,"_74":83,"_76":49,"_77":-5,"_95":243,"_18":244},{"_34":60,"_13":61,"_62":63,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":94,"_17":31,"_72":73,"_74":75,"_76":49,"_77":-5,"_95":241,"_18":242},[],[61],[],[80],[],[86,111],[],[86,61],[],[86,125],[],[86,132],[],[86,139],[],[86,146],[233,234,235,236,237,238],[86],["D",1744751975330],{"_11":12,"_193":189},{"_11":12,"_187":-5,"_188":189,"_158":159,"_190":191,"_192":49},{"_17":68,"_13":16,"_34":66,"_40":152,"_43":35,"_44":42,"_184":51,"_185":41,"_186":54,"_55":14,"_52":12},"ctx",{"_178":-5,"_211":296,"_297":298,"_299":300,"_301":49,"_302":49,"_303":49,"_304":70,"_305":-5,"_306":-7,"_307":-7,"_308":31,"_309":49,"_310":49,"_311":-5,"_312":49,"_313":49,"_314":49,"_315":-5},"ENV",{"_267":268,"_269":270,"_271":16,"_272":273,"_274":275,"_276":277,"_278":279,"_280":281,"_282":283,"_284":285,"_286":287,"_288":289,"_290":291,"_292":293,"_294":295},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Code