diff options
Diffstat (limited to 'client/draw.js')
| -rw-r--r-- | client/draw.js | 48 |
1 files changed, 48 insertions, 0 deletions
diff --git a/client/draw.js b/client/draw.js new file mode 100644 index 0000000..3ff6620 --- /dev/null +++ b/client/draw.js @@ -0,0 +1,48 @@ +import { + browser, requestAudioContext, + randint, randrange, clamp, +} from './lib/util' + +import mouse from './lib/mouse' +import color from './lib/color' + +const canvas = document.createElement('canvas') +const ctx = canvas.getContext('2d') +document.body.appendChild(canvas) + +let w, h +function resize(){ + w = canvas.width = window.innerWidth + h = canvas.height = window.innerHeight +} +document.body.addEventListener('resize', resize) +resize() + + +function clear(n){ + ctx.fillStyle = 'rgba(255,255,255,' + (n || 0.5) + ')' + ctx.fillRect(0,0,w,h) +} +function triangle(px, py, r) { + ctx.save() + ctx.globalCompositeOperation = 'difference' + ctx.fillStyle = color((px+py)/(w+h), 0, 1, 1) + function p(){ + let theta = randrange(0, Math.PI*2) + let x = px + Math.cos(theta) * r + let y = py + Math.sin(theta) * r + return { x, y } + } + ctx.beginPath() + const p0 = p(), p1 = p(), p2 = p() + ctx.moveTo(p0.x, p0.y) + ctx.lineTo(p1.x, p1.y) + ctx.lineTo(p2.x, p2.y) + ctx.lineTo(p0.x, p0.y) + ctx.fill() + ctx.restore() +} + +export default { + triangle, clear +}
\ No newline at end of file |
