- From: Keith Cirkel <notifications@github.com>
- Date: Fri, 21 Jul 2017 12:40:17 +0000 (UTC)
- To: w3c/uievents <uievents@noreply.github.com>
- Cc: Subscribed <subscribed@noreply.github.com>
- Message-ID: <w3c/uievents/issues/151@github.com>
(From whatwg/html#2856) ### Use Case Often times, when adding keyboard event listeners, one would like to determine if a modifier key is pressed (one of `ctrlKey`, `metaKey`, `altKey`, `shiftKey`) to create keyboard shortcuts in a webapp type scenario. The inherent problem with checking for truthiness of these values is that this becomes "greedy" - one also needs to check the falseness of other keys. As such it becomes quite a lot of code to determine if only a single modifier is pressed: ```js // Pressing `j` scrolls to next item, ctrl+j scrolls down 2 items document.addEventListener('keypress', event => { if (event.key === 'j' && !(event.ctrlKey || event.altKey || event.metaKey || event.shiftKey)) { scrollDownOneItem() } if (event.key === 'j' && event.ctrlKey && !(event.altKey || event.metaKey || event.shiftKey)) { scrollDownTwoItems() } }) ``` ### Reasoning This is problematic because it is an easy thing to miss while developing, and it is a fair amount of boilerplate code to check a handful of properties to ensure they are false. ### Requirements So to solve this, I believe the solution should keep to these requirements: - The solution should be able to determine if _one or more modifier_ keys are truthy, while ensuring rest of the available modifier keys are falsey. - The solution should be one method call or property, rather than the current multiple properties. -- You are receiving this because you are subscribed to this thread. Reply to this email directly or view it on GitHub: https://github.com/w3c/uievents/issues/151
Received on Friday, 21 July 2017 12:40:48 UTC