Before — Preposition Programming

Fig. 1 Sequential stages — prerequisites finish before the main mover starts

Try it — drag, click, or tap inside the figure.

Open in p5 Web Editor Fork and experiment with this sketch

Concept

BEFORE means earlier than a reference event. In code, finish prerequisite steps before the primary action runs.

Translation strategy

Ways to express before in code:

Prerequisites: Gate the main action behind a readiness check
Sequential stages: Run setup motion, then primary motion
State flags: Track whether each prerequisite has completed

Key p5.js methods

Key methods

State
• Booleans such as isClearing and isMoving
• Arrays of obstacles with hasCleared per item

Loops
• for (let item of array) — check every prerequisite

Motion
• lerp(), dist() — move obstacles aside

Pointer input
• mousePressed() — start motion or set a target
• mouseX, mouseY — click position

Code pattern

Code pattern

1. Create prerequisites
obstacles.push({ x, y, hasCleared: false });

2. Test readiness
let allClear = obstacles.every(o => o.hasCleared);

3. Start main action only when ready
if (allClear) { isClearing = false; isMoving = true; }

4. Report progress
text("Clearing path (" + cleared + "/" + total + ")", x, y);