feat: touch/swipe controls for the snake game (#14) - #15
Merged
radiusred-cody[bot] merged 1 commit intoAug 29, 2026
Merged
Conversation
Add touch support alongside the keyboard so the game is playable on a touchscreen with no keyboard (M2-R3). A swipe on the board steers the snake: touchstart/touchend deltas pick the dominant axis and feed the same SnakeGame.setDirection buffer the keyboard drives, so the two input paths cannot diverge and a 180-degree swipe is rejected for free. Short drags below a threshold are ignored as taps. touch-action: none on the canvas plus preventDefault keep a board drag from scrolling the page; the existing Restart button is already tappable, so no keyboard is needed to recover from game over. Extends the dependency-free browser harness with an M2-R3 suite covering swipe steering on both axes, tap rejection, reversal rejection, and touch working alongside the keyboard in one session. Co-Authored-By: Claude Opus 4.8 <[email protected]>
![radiusred-checky[bot]](https://avatars.githubusercontent.com/in/4719924?s=60&v=4){kind=small}
There was a problem hiding this comment.
Approved for M2-R3.
The diff follows task #14's recorded plan: touch input remains in the inline controller, uses the same SnakeGame.setDirection path as keyboard input, rejects short drags and reversals as specified, preserves page position during board gestures, retains the existing tappable restart path, and updates the hint. The implementation satisfies milestone #9's requirement that touch/swipe controls work alongside keyboard controls, with no undeclared deviation or unresolved decision gate.
Verified on head f85700b2ca8e8e1df56d44e9b2f716848139e4f3:
npm test— 46 passed, 0 failednode --test— 46 passed, 0 failed
radiusred-cody
Bot
deleted the
task/14-touch-swipe-controls-for-the-snake-game
branch
August 29, 2026 22:33
This was referenced Aug 29, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Touch/swipe controls so Snake is playable on a touchscreen with no keyboard (M2-R3), added alongside the existing keyboard controls.
How
Input handling stays in the inline controller in
index.html;game.jsremains a pure, DOM-free logic module.touchstart/touchmove/touchendlisteners on the board canvas. Thetouchenddelta fromchangedTouches[0]picks the dominant axis and maps toup/down/left/right, feeding the sameSnakeGame.setDirection(state, dir)buffer the keyboard drives — so keyboard and touch can never disagree, and a 180° reversal swipe is rejected for free (setDirectionalready refuses it).SWIPE_MIN_PX(24px) are treated as taps, not swipes.touch-action: noneon the canvas pluspreventDefault()in the handlers keep a board drag from scrolling/zooming the page.Tests
Extends the dependency-free vm/DOM harness in
tests/browser.test.js(no jsdom, no install) with an M2-R3 suite: listeners are wired on the canvas, an up swipe and a post-turn left swipe steer the head on both axes, a sub-threshold drag is ignored, a reversal swipe is rejected, and touch + keyboard drive the same session. Full suite: 46 passing vianpm test(node --test).Requirements
Satisfies M2-R3 of milestone #9. No
game.jschange; the ROADMAP M2 row already exists.Closes #14