Detecting Status Bar Double-Click in VSCode Extension

If you’re developing Visual Studio Code extension that deals with statusbar, you might have noticed that it’s activated with a single click. Yes, there is no way to specify double-click behavior. But what if you really, really, want that double-click? Well, you can use trickery.

For example, you can use a timer to help you out:

var doubleClickTimerId

vscode.commands.registerTextEditorCommand("statusbar.command", () => {
  if (!doubleClickTimerId) { //if timer still exists, it's a double-click
    doubleClickTimerId = setTimeout(singleClick, 250); //do single-click once timer has elapsed
  } else {
    clearTimeout(doubleClickTimerId) //cancel timer
    doubleClickTimerId = undefined

    //code for double-click
  }
})

function singleClick() {
  clearTimeout(doubleClickTimerId) //cancel timer
  doubleClickTimerId = undefined

    //code for single click
}

On first click this code will setup a callback to be executed in 250 ms. If nothing else happens, after timer has elapsed, function singleClick will be called and your single-click code will be executed.

However, if another click happens before timer elapses, statusbar command will cancel the timer and execute the double-click code.

Final effect is that any clicks slower than 250 ms get detected as independent while all faster clicks get a double-click treatment – exactly what we wanted.

PS: If you’re wondering why I needed this, it was for my Code Point extension. Single click changes between display style for Unicode character while double click sends you to a web page with much more information.

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.