How to handle Samsung S-Pen button event in the browser (Javascript)?

965 Views Asked by At

I'm developing a web app for the Galaxy Tab S3 that allows the user to draw with a Samsung S-Pen. The S-Pen has a button on the side which I know can be used by native Android applications to perform various functions. However, I am having a hard time figuring out how to identify which event gets fired in the browser when this button is pressed (or even if an event is fired?).

I have tried out all of the PointerEvents and TouchEvents and I tried identifying an event here: https://patrickhlauke.github.io/touch/

I also found nothing in the S-Pen SDK: https://developer.samsung.com/galaxy-spen-remote/overview.html

And unfortunately this post was removed: https://stackoverflow.com/questions/51489489/detecting-pen-stylus-button-events-in-javascript

Does anybody know the name of the event or where I can figure this out?

1

There are 1 best solutions below

0
Michael G On

I found no documentation anywhere. From button-usefulness experimentation in Chrome on my Galaxy tablet:

Detecting the button pressed "in the air" above the screen:

element.onpointermove = e => {
  //screen-contact registers as the primary button.
  //primary button with zero screen contact implies the S-Pen button
  if( e.button === 1 && e.pressure === 0 )
    console.log( "The S-Pen button is being pressed in the air." );
}

When the S-Pen button is pressed in the air, then the stylus makes contact with the screen, and then leaves the screen, Chrome will trigger a contextmenu event. (As far as I have been able to find by searching settings, cannot behavior cannot be modified.)

element.oncontextmenu = e => {
  console.log( "The S-Pen button was being pressed, the stylus made contact with the screen, and then the stylus lost contact with the screen." );
}

If the S-Pen button is pressed while the stylus makes contact with the screen, the browser stop firing pointer events entirely until the stylus loses contact with the screen, even if the S-Pen button is released during contact.

This makes developing a painting app that utilizes the S-Pen button mostly impossible. However, it is somewhat possible to use the S-Pen coordinates and button state as long as the user does not touch the screen.

Documentation on the part of someone would be much appreciated. I half-suspect that the code interactions have fallen through the cracks, and there are no engineers or developers currently at Samsung and Google who know what their code is doing here.