Browse Source

docs(keycodes-symphony): correct grammar

1164-findmissingnumber
davhojt 2 years ago committed by Dav Hojt
parent
commit
4cdc68b6e2
  1. 25
      subjects/keycodes-symphony/README.md

25
subjects/keycodes-symphony/README.md

@ -2,28 +2,27 @@
### Instructions
Like an inspired Beethoven who's going to write his Moonlight Sonata, you're about to compose a colourful symphony of letters with your keyboard.
Like an inspired Beethoven who's about to write his Moonlight Sonata, you're about to compose a colorful symphony of letters with your keyboard.
Write the function `compose`:
- Make it fire every time a key is pressed
- Create a new `div` with the class `note` when a letter of the lowercase alphabet is pressed, which has a unique background color generated using the `key` of the `event`, and displays the corresponding letter pressed
- If the pressed key is the `Backspace` one, delete the last note
- If the pressed key is the `Escape` one, clear all the notes
### Notions
- [Keyboard event](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent): [`keydown`](https://developer.mozilla.org/en-US/docs/Web/API/Document/keydown_event), [`key`](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key)
- Make it fire every time a key is pressed.
- Create a new `div` with the class `note` when a letter of the lowercase alphabet is pressed. It should have a unique background color generated using the `key` of the `event`. It should also displays the corresponding pressed character.
- When `Backspace` is pressed, delete the last note.
- When `Escape` is pressed, clear all the notes.
### Files
You only need to create & submit the JS file `keycodes-symphony.js` ; we're providing you the following file to download (click right and save link) & test locally:
You only need to create & submit the JS file `keycodes-symphony.js`; we're providing you the following file to download to test locally:
- the HTML file [keycodes-symphony.html](./keycodes-symphony.html) to open in the browser, which includes:
- the JS script which will allow to run your code
- some CSS pre-styled classes: feel free to use those as they are, or modify them
- the JS script which will allow to run your code.
- some CSS pre-styled classes: feel free to use those as they are, or modify them.
### Expected result
You can see an example of the expected result [here](https://youtu.be/5DdijwBnpAk)
### Notions
- [Keyboard event](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent): [`keydown`](https://developer.mozilla.org/en-US/docs/Web/API/Document/keydown_event), [`key`](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key)

Loading…
Cancel
Save