Changing Snake Movement Controls and Canvas Focus Behavior

[0Kaju12]

Actual Behavior

Description

In the example

I encountered an issue in the Snake game implementation where the movement controls are set to 'i', 'j', 'k', 'l', and the canvas doesn't receive focus automatically when the game starts. I propose to enhance the game by:

Changing Movement Controls: Modify the control scheme to use 'w', 'a', 's', 'd' along with arrow keys for the snake's movement to improve user experience.

Auto-Focus Canvas on Game Start: Ensure the canvas receives focus automatically when the game starts, allowing immediate keyboard interaction without requiring a click on the canvas.

This enhancement aims to provide a more intuitive control scheme and ensure a seamless gaming experience.

Uploading p5.js Web Editor _ Interaction_ snake - Google Chrome 2024-01-06 01-20-14.mp4…

Expected Behavior

The game should support 'w', 'a', 's', 'd' and arrow keys for movement, and the canvas should automatically receive focus when the game starts, enabling immediate keyboard interaction without the need for clicking on the canvas.

Steps to reproduce

[]https://editor.p5js.org/p5/sketches/Interaction:_snake

• Run the Snake game.
• Observe that the controls are currently set to 'i', 'j', 'k', 'l'.
• Note that the canvas does not automatically receive focus on game start.

[welcome[bot]]

Welcome! 👋 Thanks for opening your first issue here! And to ensure the community is able to respond to your issue, be sure to follow the issue template if you haven't already.

[aditya123473892]

it is an example user can change it on their own i think i don't think its a bug

[0Kaju12]

@aditya123473892 absolutely we can always change the code but i think those who are new to the website it might become a little bit overwhelming and changing it to w,a,s,d or arrow keys will be little bit easier to control . Also when we run the example we have to click on the canvas screen then only we can move which i think is not quite write as at the starting it looks like there is something wrong with the example code

[raclim]

Thanks for raising this!

Since this issue involves the p5.js examples, I think this might be an issue for the p5.js repo! I'm going to transfer this issue there, but feel free to raise this here again if that might not be the case.

[welcome[bot]]

Welcome! 👋 Thanks for opening your first issue here! And to ensure the community is able to respond to your issue, please make sure to fill out the inputs in the issue forms. Thank you!

[JainilModi25]

Hello! As far as I can tell, this game's code has been imported from Mr. Prashant's github, who has actually coded this game. Also, the i,j,k,l keys can be easily replaced by w,a,s,d keys as the switch cases written for them are the ASCII codes for the letters. Unfortunately, I cannot find the exact file where we need to change the code. In the ss below, I have changed the ASCII codes to w,a,s,d and it works as expected in the canvas.

This is one of my first github comments so open for any suggestions! Thank You.

[limzykenneth]

Actually in this case I'm wondering wouldn't straight up arrow keys instead of WASD or IJKL be more intuitive for this keyboard only game?

[JainilModi25]

Yes, the arrow keys could be a better choice too. Although now I am wondering what if the creators of the game actually set the controls to i,j,k,l because of a particular reason? Might be that it was affecting/breaking some other things? Would love to hear from the creator/maintainers!

[limzykenneth]

@calebfoss I believe you have been looking into the examples recently, if you have the capacity would you mind having a look at this one and advice on whether we should go with WASD or arrow keys, or other resolutions?

[calebfoss]

@limzykenneth I revised this example as part of the larger examples revision project: https://github.com/processing/p5.js-example/blob/main/examples/10_Games/02_Snake.js Among other changes, the example now uses arrow keys and includes a start screen to direct users to click the canvas for focus. Since this version will be included in the new website, I think this issue can be closed.

[limzykenneth]

Thanks @calebfoss, I'll close this but also deep thanks for everyone who looked into this.