Comments (5)
Yeah, this is an open issue. I investigated this way back and I recall, at least on mac, an issue with the "ctrl" key being registered as pressed when a lot of keys are pressed down at once, which causes notes to not register due to this line of code, and potentially also just keydown events not firing as expected.
I'll have to dig into it again. Any help on investigating this is welcome!
from react-piano.
I noticed this also happens when attempting to press down any 3 keys corresponding to sequential half steps (e.g. D, D#, E).
from react-piano.
This appears to not be specific to this component or to React - I created a codepen that demonstrates the issue for vanilla JS: https://codepen.io/kevinqi/pen/ZPxGoa
from react-piano.
ahh, it appears that this could be an issue with key rollover (a property of the keyboard), not anything JS related. See https://apple.stackexchange.com/a/70430/149027. If this is the issue, then it can't be fixed - it's an inherent limitation of the keyboard you use.
Both my macbook pro keyboard and mac magic keyboard, for example, are unable to register "s" + "e" + "d" when pressed down simultaneously. However, when I tested with a Das keyboard, it was able to register all 3 simultaneously.
@SeunghunSunmoonLee you mentioned that "I found other piano examples be able to do [6 keys at the same time]". Could you link me to an example piano where that works?
from react-piano.
Going to close this given that I think this is a hardware keyboard rollover issue and not related to the library, but if anyone can demonstrate otherwise, don't hesitate to reopen the issue.
from react-piano.
Related Issues (20)
- register keyboard events on custom dom nodes?
- When using two piano keyboards in two lines, on renderNoteLabel only labels on bottom keyboard will be turned of on
- What's the difference between playNote and onPlayNoteInput?
- npm install fails HOT 1
- The mousedown listener is placed on the whole document.
- Question: How do I record the input and save it so I can use it later for play along like a piano learning app? HOT 5
- activeNotes prop is not used to initialize state on first render
- Rounding of corners does not scale HOT 2
- Allow more key combination with event.code instead? HOT 1
- Separating the utilities from the UI HOT 4
- Internationalization issue (Y and Z) HOT 1
- How to sustain Active Notes on Mouse Over? HOT 3
- Does this or will this support a MIDI Keyboard? HOT 3
- Octave keyboard shortcut?
- How do I turn a key blue. I can play a sound by calling playNote but it doesn't color the key in the same way it is when I press down on it physically.
- mazzeka.com
- Disable Shortcut Labels
- on play / stop functions without pressing a button HOT 1
- how to display notes on keys HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-piano.