Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Adding a custom keyboard shortcut using userscript to Chrome with Tampermonkey

I would like to add some custom keyboard shortcuts to a certain web page.

Using the accepted answer from this question as a guide: How can I add a JavaScript keyboard shortcut to an existing JavaScript Function?

I made my own little function and added a listener:

// ==UserScript==
// @name       ChartGame
// @namespace  http://www.chartgame.com/
// @version    0.1
// @description  enter something useful
// @match      http://www.chartgame.com/play*
// @copyright  2012+, You
// ==/UserScript==
function doc_keyUp(e) {
  switch(e.keyCode)
  {
  case 49: //1
    mon_clk(3);
    break;
  case 50:
    mon_clk(6);
    break;
  case 83: //s
    BuySell(0);
    break;
  case 68: //d
    BuySell(1);
    break;
  case 70: //f
    TimelapseDwn();
    TimelapseUp();
    break;
   default:
     break;
  }
}
document.addEventListener('keyup', doc_keyUp, false);

This code runs just perfectly fine if I enter it into the Chrome javascript console while on the appropriate web page. I can use the keyboard shortcuts as I intended. The only problem is that I have to reenter javascript code including the listener if I go to a next game(that is chart..).

My impression was that Tampermonkey would allow me to run this script automatically on specific pages that match the expression on @match. The code does appear to run, but there is no keyboard shortcut functionality.

What is missing or what is different from running javascript code from Chrome console and from an extension such as Tampermonkey?

like image 984
Sint Avatar asked Nov 13 '12 13:11

Sint


People also ask

What type of code does Tampermonkey use?

Tampermonkey is a donationware userscript manager that is available as a browser extension. This software enables the user to add and use userscripts, which are JavaScript programs that can be used to modify web pages.


1 Answers

That code does not work in a userscript because it is calling javascript functions defined by the target page. Userscripts operate in various sandboxes, and so cannot see the target page's JS so easily.

Tampermonkey (and Greasemonkey) provide a way around this with unsafeWindow. (Plain Chrome userscripts do not support unsafeWindow in any useful way.)

So, to use those functions, prefix them like so:

// ==UserScript==
// @name       ChartGame
// @namespace  http://www.chartgame.com/
// @version    0.1
// @description  enter something useful
// @match      http://www.chartgame.com/play*
// @copyright  2012+, You
// ==/UserScript==
function doc_keyUp(e) {
    switch (e.keyCode) {
        case 49:
            //1
            unsafeWindow.mon_clk(3);
            break;
        case 50:
            unsafeWindow.mon_clk(6);
            break;
        case 83:
            //s
            unsafeWindow.BuySell(0);
            break;
        case 68:
            //d
            unsafeWindow.BuySell(1);
            break;
        case 70:
            //f
            unsafeWindow.TimelapseDwn();
            unsafeWindow.TimelapseUp();
            break;
        default:
            break;
    }
}
document.addEventListener('keyup', doc_keyUp, false);


An alternative approach, and one that works on plain Chrome userscripts, is to Inject your code. But since you are using Tampermonkey, just use the unsafeWindow approach in this case.

like image 108
Brock Adams Avatar answered Sep 22 '22 15:09

Brock Adams