[w3c/uievents] Proposal: Way to determine if any modifier key is pressed (#151)

(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