sprout-guard

Sprout & Guard is a purely static plant tower defense web mini-game with a cream picture-book style. Players collect sunlight, plant plants, and defend a 5-row by 9-column garden. The project offers two independently selectable levels: Sunny Yard contains 3 waves of attacks, suitable for getting familiar with the basic gameplay; Sunset Garden contains 4 waves of attacks and adds stronger challenges such as roadblocks, buckets, and fast zombies. The game includes five plants: Sunflower, Peashooter, Wall-nut, Snow Pea, and Cherry Bomb, each with different sunlight costs and effects. Players need to click sunlight to obtain resources, select plant cards to plant, and use cooldowns, shoveling, and the one-time lawn mower mechanism per row to deal with zombie attacks. The project supports PC mouse operation and keyboard shortcuts (1-5 to select plants, 6 to select the shovel, Space to pause, Esc to cancel selection). It also provides a landscape immersive layout for phones and tablets, and attempts to automatically enter fullscreen. Level completion records and sound settings are saved locally in the browser. The game has no third-party runtime dependencies, external asset requests, or backend services. When all files are present, it can run in an offline environment through a local HTTP server. Because it uses browser ES Modules, you cannot directly double-click index.html; you need to start a static server (such as python -m http.server 8000) and then access it. The project can also be deployed directly to GitHub Pages without a build step. The code structure is clear: index.html is responsible for the page structure, style.css handles the picture-book style interface and landscape adaptation, main.js manages interactions, animations, and sound, engine.js implements plants, zombies, waves, and win/loss rules, and art.js is responsible for Canvas character and scene drawing.