- From: Jimmy Wärting <notifications@github.com>
- Date: Thu, 04 Mar 2021 13:17:19 -0800
- To: w3c/uievents <uievents@noreply.github.com>
- Cc: Subscribed <subscribed@noreply.github.com>
- Message-ID: <w3c/uievents/issues/294@github.com>
I found [this](https://stackoverflow.com/a/60177326/1008999) solution to work the best among a few answer on [SO](https://stackoverflow.com/q/5497073/1008999)
```js
const button = document.getElementById('button')
let timer
button.addEventListener('click', event => {
if (event.detail === 1) {
timer = setTimeout(() => {
console.log('click')
}, 200)
}
})
button.addEventListener('dblclick', event => {
clearTimeout(timer)
console.log('dblclick')
})
```
However it isn't perfect. it can still log both click and dbclick sometimes if you click somewhat slow & fast. The problem with all of the other solution i found where that they use a custom setTimeout delay.
> Implementations MUST maintain the current click count when generating mouse events. This MUST be a non-negative integer indicating the number of consecutive clicks of a pointing device button within a specific time. **The delay after which the count resets is specific to the environment configuration.**
if you can't match the environment delay then you can't reliable differentiate single click event and double click event.
I think a event is needed to know when UIevent.detail resets to 0 again.
I would want to have a single event that dispatch when consecutive clicks stops counting that tells you how many click you did.
```js
button.addEventListener('consecutive-clicks-end', event => {
console.log('you clicked on this button ' + event.detail + ' times')
console.log('next click event will have a detail count of 1')
}, { once: true })
```
--
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/294
Received on Thursday, 4 March 2021 21:17:31 UTC