|
|
|
# Key Value
|
|
|
|
|
|
|
|
**Tier:** 1-Beginner
|
|
|
|
|
|
|
|
Have you ever thought about what it means that the computer you are using is
|
|
|
|
a digital device? Among other things it means that everything its capable of
|
|
|
|
is achieved by translating a digital signal into a sequence of binary digits - 0's and 1's. These binary digits form codes used to represent data.
|
|
|
|
|
|
|
|
The keyboard you used to retrieve this project description is a great example
|
|
|
|
of this. Pressing a key generates a digital signal that is translated by the
|
|
|
|
computer into a code representing the key that was pressed.
|
|
|
|
|
|
|
|
The goal of the Key Value app is to display the encoded value on screen each
|
|
|
|
time a key is pressed on the keyboard.
|
|
|
|
|
|
|
|
## User Stories
|
|
|
|
|
|
|
|
- [ ] User can see a display panel containing a text area where the key value
|
|
|
|
and key code will be displayed along with display areas for four other
|
|
|
|
indicators related to the keys on the keyboard - alt key, control key,
|
|
|
|
meta key, and shift key.
|
|
|
|
- [ ] User can see the key code and key value displayed in the display panel
|
|
|
|
cooresponding to the key when it is pressed.
|
|
|
|
- [ ] User can see the appropriate indicator change from 'False' to 'True'
|
|
|
|
when the alt, control, meta, or shift key is pressed.
|
|
|
|
|
|
|
|
## Bonus features
|
|
|
|
|
|
|
|
- [ ] User can hear a unique tone played when a key is pressed.
|
|
|
|
- [ ] User can see the background color of the key code and value change when
|
|
|
|
a key is pressed.
|
|
|
|
|
|
|
|
## Useful links and resources
|
|
|
|
|
|
|
|
- [Digital Electronics](https://en.wikipedia.org/wiki/Digital_electronics)
|
|
|
|
- [Keyboard Event](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent)
|
|
|
|
|
|
|
|
## Example projects
|
|
|
|
|
|
|
|
[Javascript Keyevent Test Script](https://unixpapa.com/js/testkey.html)
|