make customizable keyboard shortcuts chrome extensions

Question

I am making a chrome extension with a keyboard shortcut to open a pop-up and the code below works fine. It's just that I want the user to be able to specify the keyboard shortcut to open the browser action via the options.html page. How might I go about this?

• Note: I am not open to using Jquery, other 3rd party plugins, or content-scripts.

I would prefer to use a dropdown w/ the allowed shortcut keys (Ctrl+Shift+Alt, Ctrl+Shift, Ctrl+Alt, Ctrl, & Alt) mixed with a textbox only allowing one key to be entered.

That last part is a sub-question, but the main thing here is:

How Can I make Customizable Keyboard shortcuts within options page?

Manifest.json:

|  ...  |
"browser_action": {
  "default_icon": "png/Icon-128.png",
  "default_title": "Gamez.io",  
  "default_popup": "popup.html"
},
"background": {
  "scripts": ["background.js"],
  "persistent": false
},
"permissions": [
   "activeTab",
    "tabs"
],
"commands": {
  "_execute_browser_action": {
    "suggested_key": {
      "windows": "Alt+X",
      "mac": "Alt+X",
      "chromeos": "Alt+X",
      "linux": "Alt+X"
    }
  }
}

Answer 1

I figured out a way... Well kind of...

Steps:

1. Create a content.js file and list it in your manifest.
2. Then add the following code to your content.js file:

content.js:

window.onkeyup = function(e) {
  if (e.which == 69) {
    window.alert('You pressed \'e\' !');
  }
};

Then see Here on how to make custom keyboard-shortcuts using JS.

3. Use JSON Files and chrome.setlocalstorage(something along those lines [still working on it] ) to save the users input from options.html.

My current Question: Here How the heck do I trigger the Browser_Action!?