protect zaps from webgl occasionally being unavailable

This commit is contained in:
keyan 2023-10-31 09:48:39 -05:00
parent e939026295
commit b5828cdf94

View File

@ -57,22 +57,26 @@ export function Ghost ({ onDone }) {
const texture = textureRef.current const texture = textureRef.current
if (canvas.ghost) return if (canvas.ghost) return
canvas.ghost = new GhostCanvas(canvas, texture, { try {
size: getRandom(0.025, 0.075), canvas.ghost = new GhostCanvas(canvas, texture, {
tail: { size: getRandom(0.025, 0.075),
dotsNumber: 25, // Math.floor(getRandom(10, 50)), tail: {
spring: 1.4, // getRandom(1, 1.8), dotsNumber: 25, // Math.floor(getRandom(10, 50)),
friction: 0.25, // getRandom(0.1, 0.25), spring: 1.4, // getRandom(1, 1.8),
maxGravity: 250, friction: 0.25, // getRandom(0.1, 0.25),
gravity: getRandom(5, 250) maxGravity: 250,
}, gravity: getRandom(5, 250)
smile: 1, },
mainColor: [getRandom(0.8, 1), getRandom(0.8, 1), getRandom(0.8, 1)], smile: 1,
borderColor: [getRandom(0, 0.2), getRandom(0, 0.2), getRandom(0, 0.2)], // [0.2, 0.5, 0.7], mainColor: [getRandom(0.8, 1), getRandom(0.8, 1), getRandom(0.8, 1)],
isFlatColor: false, borderColor: [getRandom(0, 0.2), getRandom(0, 0.2), getRandom(0, 0.2)], // [0.2, 0.5, 0.7],
onDone isFlatColor: false,
}) onDone
}, []) })
} catch (e) {
console.error(e)
}
}, [canvasRef, textureRef, onDone])
return ( return (
<> <>
@ -137,6 +141,7 @@ const GhostCanvas = (canvas, texture, params) => {
let uniforms let uniforms
const gl = initShader() const gl = initShader()
if (!gl) return
function generateRandomPath () { function generateRandomPath () {
const startPoint = { const startPoint = {
@ -167,7 +172,7 @@ const GhostCanvas = (canvas, texture, params) => {
const path = generateRandomPath() const path = generateRandomPath()
let currentPathIndex = 0 let currentPathIndex = 0
let pathStartTime = null let pathStartTime = null
const segmentDuration = getRandom(750, 3000) // How long each Bezier segment should take const segmentDuration = getRandom(750, 1500) // How long each Bezier segment should take
function evaluateBezier (bezier, t) { function evaluateBezier (bezier, t) {
const [p0, p1, p2, p3] = bezier const [p0, p1, p2, p3] = bezier