9

Currently I'm developing a LG webOS application (using Vue.js). Everything works fine, except the fact that when I press the back button on the remote, the back event does not fire. This causes that I'm forced to assign the function to go back to the previous page, to another button (which is not user friendly) instead of the normal return button.

(FYI: I'm using a webOS Signage display)

I've read the documentation about the history API and handling the back event (webOS Back Button) and tried the following, but none of what I tried works:

  • SettingdisableBackHistoryAPI to true in appinfo.json and then manually catching the keydown event when the back button is pressed (keycode 461);
  • SettingdisableBackHistoryAPI to false in appinfo.json and then adding an eventlistener for the popstate event
  • Vice versa (cause you never know)

Even trying to catch the back button press event (so catching keycode 461) doesn't work. The application recognizes all other keycodes, but pressing the back button simply doesn't do anything (fires no event). Anyone has any idea on this?

To be sure the problem is not per se application bound, I installed the following application Back Button Application. The same result: no back event.

Code to catch key event (logs all keycodes except 461):

window.addEventListener('keydown', evt => {
    evt = evt || window.event
    console.log(evt.keyCode)
    if (evt.keyCode === 461) {
        router.go(-1)
    }
  })

The back button is being registered on the LG webOS emulator (v4.0). The framework I'm using as stated earlier, is Vue.js and I use Cordova Toast to compile my projects to LG webOS (and in the future to Samsung Tizen).

-- BOUNTY EXPIRED BUT STILL LOOKING FOR AN ANSWER --

Condor
  • 199
  • 2
  • 22

3 Answers3

3

Try adding this code into the head section of your index.html, and "disableBackHistoryAPI": true into your appinfo.json: 

<script src="webOSTVjs-1.1.0/webOSTV.js" charset="utf-8"></script>
<script src="webOSTVjs-1.1.0/webOSTV-dev.js" charset="utf-8"></script>
<script type="text/javascript">

    window.addEventListener("keydown", function(e) {
        console.log("[keyCode] : " + "[" + e.keyCode + "]");

        switch (e.keyCode) {
            case 461:
                console.log("Back key pressed");
                webOS.platformBack();

                break;
        }
    });

</script>

Please remember that ES6 is not supported in the LG webOS TV. I guess you already know that and use Babel to convert the code.

Please refer to this page for more information.

burakk
  • 1,231
  • 2
  • 22
  • 45
  • Thank you for your response. Unfortunately, this catches all keycodes, except `461`. There is something going on that makes the application/tv refusing the return button to fire any event. Even trying a different remote made no difference. I made a litte edit to my post about the framework I'm using and my emulator experience. I doubt this has anything to do with it though. – Condor Aug 27 '19 at 10:11
  • Can you see the "[keyCode] : " entries in the debug console? – burakk Aug 27 '19 at 10:25
  • Yes I can. And on the emulator it all works fine, but as soon as I open the application on a real tv, it doesn't work (catching keycode `461`). Is it possible it has something to do with the tv being a Signage display? – Condor Aug 27 '19 at 10:30
  • I have never worked on the Signage displays, but if the code works fine on the emulator, then probably you are right and we can conclude that the Back button does not work in Signage displays. You should get it confirmed by LG, though. – burakk Aug 27 '19 at 10:59
  • Alright, I will do that. Thank you for your effort nevertheless! If I can't find any answer, I'll accept your answer/assign the bounty to you. – Condor Aug 27 '19 at 11:10
  • OK, thanks. I hope that you'll find the answer. Please don't forget to share it here. – burakk Aug 27 '19 at 11:15
1

Were you able to use the BACK button on the remote control? I have the same problem here.

This code see the other buttons, except the back button.

    window.addEventListener("keydown", function(inEvent){   

        if(window.event) {
            keycode = inEvent.keyCode;
        } else if(e.which) {
            keycode = inEvent.which;
        }

        document.getElementById("BtnControle").innerHTML = keycode;

    });
Rafael Vinícius
  • 21
  • 3
  • Nope, never found a solution unfortunately. I assigned the back event to the stop button (the button with the square on it). Pretty shameful that it doesn't work with the button that should be assigned for the task.. – Condor May 27 '20 at 08:29
  • It works fine on the TV but doesn't work on the emulator. If you have an LG TV, you can set up testing on there and see that it works perfectly as expected. – PRMan Oct 29 '20 at 20:46
1

In my appinfo.json I added this: disableBackHistoryAPI: true;

from there the code below started to work:

<script type = "text / javascript">
         window.addEventListener ("keydown", function (inEvent) {
             if (window.event) {
                 keycode = inEvent.keyCode;
             } else if (e.which) {
                 keycode = inEvent.which;
             }
             switch (keycode) {
                 case 461: history.back (-1); break;
                 case 38: document.getElementById ("TesteTit"). innerHTML = "up"; break;
                 case 40: document.getElementById ("TesteTit"). innerHTML = "down"; break;
             }
         });
</script>

If you can test it on your app, tell me if it worked.

Rafael Vinícius
  • 21
  • 3