Full config
const game = new PongGame({
// ── Canvas ───────────────────────────────
autoSize: true, // fit container on start
autoResize: true, // re-fit on container resize
canvasWidth: 600, // px (ignored when autoSize: true)
canvasHeight: 400, // px (ignored when autoSize: true)
// ── Game ─────────────────────────────────
ballDiameter: 8, // ball size in px
ballSpeed: 3, // starting speed (px / frame)
paddleWidth: 84, // paddle width in px
paddleHeight: 7, // paddle height in px
paddleMoveStep: 4, // px per frame while key held
gameMode: 'easy', // 'easy' | 'medium' | 'hard' | 'extreme' | 'multiplayer'
difficultyLevel: 1, // overridden by gameMode when both are set
isMultiplayer: false, // true = local 2-player on one keyboard
particleBounce: true, // particle burst on paddle hit
hasSound: true, // enable sound effects
ballImage: '', // URL of a custom image to show on the ball (optional)
showSettings: true, // false = lock settings from players
player1Name: 'Player 1',
player2Name: 'Player 2',
// ── Admin (remove before shipping) ───────
isAdmin: false, // true = unlock difficulty/timing in settings panel
// ── Timer ────────────────────────────────
timer: {
duration: '2:00', // match length (M:SS)
hasBackgroundCircle: true, // circular progress ring
labelColor: '#fff',
labelFontSize: 12,
circleColor: '#62cb31',
circleLineWidth: 5,
circleBackgroundColor: '#333',
},
// ── Colors ───────────────────────────────
colors: {
paddle: '#62cb31',
ball: '#e6e990',
background: '#000',
centerline: '#9e9c9c',
score: '#62cb31',
},
// ── Background (at most one) ─────────────
animatedBackground: {
starfield: true, // scrolling star effect
nebular: false, // scrolling cloud effect
},
// ── Particles ────────────────────────────
particleConfig: {
particlesCount: 20,
},
// ── Field items ──────────────────────────
powerUps: true, // random power-up / power-down items
obstacles: true, // random angled wall that deflects the ball
// ── Callbacks ────────────────────────────
onSoundToggle: (enabled) => console.log(enabled), // fired when sound icon is toggled
}, '#my-pong');
Admin mode
Set isAdmin: true to unlock difficulty and timing controls
in the settings panel. Use it while integrating the game to fine-tune
the feel, then remove it before going live.
new PongGame({ isAdmin: true }, '#my-pong');
In admin mode the settings panel shows all difficulty fields
(ballSpeed, paddleMoveStep, difficultyLevel, …)
and timer.duration, plus a Config JSON section
with a Copy button — paste the output directly as your initial config.
