// Canvas Playground - Particle System
// Click anywhere to spawn particles!
const canvas = document.getElementById('canvas')
const ctx = canvas.getContext('2d')
const particleCountEl = document.getElementById('particle-count')
const fpsEl = document.getElementById('fps')
const clearBtn = document.getElementById('btn-clear')
// High DPI support
function setupCanvas() {
const rect = canvas.getBoundingClientRect()
const dpr = window.devicePixelRatio || 1
canvas.width = rect.width * dpr
canvas.height = rect.height * dpr
ctx.scale(dpr, dpr)
canvas.style.width = rect.width + 'px'
canvas.style.height = rect.height + 'px'
}
setupCanvas()
window.addEventListener('resize', setupCanvas)
// Particle class
class Particle {
constructor(x, y) {