Side Buttons and On Screen button problem

[MattMack]

So, I basically have a counting app, and I've got pretty far for not knowing a single thing about how to do it. However, I have a combo-button thing, and that's supposed to let the side buttons be able to be the buttons on screen. However, my event listener only takes the button on screen input, but not the side button. If anybody could help, that would be great!

I'll post my code here:

import document from "document";

const score = document.getElementById("score");
const btntr = document.getElementById("btntr");

const counter = 0;

btntr.addEventListener("click", () => {
  counter = counter + 1;
  score.text = `${counter} `;
  console.log("TOP RIGHT!");
});

[LekoFraggle]

When you say side buttons, do you mean the corner combo buttons, or the hardware buttons on the Versa 1 and Ionic?  I can help with the former, but the latter is a bit beyond me.

[MattMack]

I mean the buttons on the Ionic and Versa.

[LekoFraggle · Accepted solution]

Ok.  I see.  It is still beyond me a bit, but here is what I would do.  

1) Make sure I am setting up the buttons correctly.  You need to use the Combo Button class, not just a regular button positioned on the side. The button needs an entry in 3 files.

1.  Only once for all instances import in widgets
2.  The svg for each in index 
3.  The implementation for each in your Javascript file.

2) I would then make certain I was using the primary and secondary buttons (the two right-hand ones).

If it still did not work, I would bypass the software buttons altogether and try just getting a hardware button to work first. Then integrating the two.

[MattMack]

Okay. I'll try that, and get back to this thread in a moment.

[MattMack]

So far, this seems to work. Now to my next problem... 

Thanks!

[LekoFraggle]

Excellent.  Good luck and have fun.