p5.js-web-editor icon indicating copy to clipboard operation
p5.js-web-editor copied to clipboard

[#3444] Add keyboard shortcut update functionality

Open karanBRAVO opened this issue 10 months ago • 3 comments

This PR adds the Edit button in keyboard shortcut modal, so that users can change the keyboard shortcuts.

Fixes #3444

Changes:

  • Add the edit button
  • creates the context to share keyMaps and updateKeyMaps function

I have verified that this pull request:

  • [x] has no linting errors (npm run lint)
  • [x] has no test errors (npm run test)
  • [x] is from a uniquely-named feature branch and is up to date with the develop branch.
  • [x] is descriptively named and links to an issue number, i.e. Fixes #123

karanBRAVO avatar Apr 10 '25 18:04 karanBRAVO

Hi @sambensim ! In that particular example, though, the second example demonstrates usage with a callback and without the error handling, which might be helpful to show that the parameters are optional.

Tagging documentation steward @perminder-17 - p5.js uses optional parameters widely, do you have a sense of whether it's useful to have the multiple usages demonstrated, or if there's some other way to make optional parameter use really understandable and tangible for beginners?

ksen0 avatar Jun 05 '25 19:06 ksen0

Thank you very much for sharing these examples. In my view, both snippets demonstrate distinct and valuable approaches, so having both examples is quite beneficial rather than problematic. The first example illustrates the well-established preload + setup pattern, which ensures that the image is fully loaded before any drawing operations occur, while the second example highlights the callback approach by invoking loadImage() directly within setup() and reacting immediately once loading completes. Each snippet therefore conveys a separate technique, one for guaranteed preloading and the other for on-the-fly loading with a callback. wihtout causing confusion. If additional clarity is desired, we could certainly include further illustrations, but these two already capture the primary options in a clear and concise manner. Thank you again for your thoughtful consideration.

@ksen0 I think the two examples we have strike a good balance but multiple demonstrations of exmples are always appriciated. To make optional parameters even clearer for beginners, we could (1) add brief inline comments in the snippets and (2) add a short “Optional Parameters” note in the Foundations section explaining that p5.js follows standard JavaScript behaviour.

perminder-17 avatar Jun 05 '25 23:06 perminder-17