Demonstrate changing keyboard shortcut values

This commit is contained in:
Will Bamberg
2018-03-22 13:40:35 -07:00
parent 3267c485c2
commit 73ccd28cb3
4 changed files with 66 additions and 1 deletions

View File

@@ -10,7 +10,7 @@
* shortcut: "Ctrl+Shift+U"
* }]
*/
var gettingAllCommands = browser.commands.getAll();
let gettingAllCommands = browser.commands.getAll();
gettingAllCommands.then((commands) => {
for (let command of commands) {
// Note that this logs to the Add-on Debugger's console: https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Debugging

View File

@@ -13,5 +13,10 @@
"suggested_key": { "default": "Ctrl+Shift+U" },
"description": "Send a 'toggle-feature' event to the extension"
}
},
"options_ui": {
"page": "options.html",
"browser_style": true
}
}

18
commands/options.html Normal file
View File

@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form>
<label>Keyboard shortcut</label>
<input type="text" id="shortcut" >
<button id="update">Update keyboard shortcut</button>
<button id="reset">Reset keyboard shortcut</button>
</form>
<script src="options.js"></script>
</body>
</html>

42
commands/options.js Normal file
View File

@@ -0,0 +1,42 @@
const commandName = 'toggle-feature';
/**
* Update the UI: set the value of the shortcut textbox.
*/
async function updateUI() {
let commands = await browser.commands.getAll();
for (command of commands) {
if (command.name === commandName) {
document.querySelector('#shortcut').value = command.shortcut;
}
}
}
/**
* Update the shortcut based on the value in the textbox.
*/
async function updateShortcut() {
await browser.commands.update({
name: commandName,
shortcut: document.querySelector('#shortcut').value
});
}
/**
* Reset the shortcut and update the textbox.
*/
async function resetShortcut() {
await browser.commands.reset(commandName);
updateUI();
}
/**
* Update the UI when the page loads.
*/
document.addEventListener('DOMContentLoaded', updateUI);
/**
* Handle update and reset button clicks
*/
document.querySelector('#update').addEventListener('click', updateShortcut)
document.querySelector('#reset').addEventListener('click', resetShortcut)