%label
%description
%label
%description
Gamepad Navigator Click Tests
27 | 28 | 29 | 30 |
34 |
35 | 36 |
37 |
41 |
49 |
50 |
51 |
52 |
--------------------------------------------------------------------------------
/src/js/content_scripts/search-keyboard.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 | (function (fluid) {
13 | "use strict";
14 | var gamepad = fluid.registerNamespace("gamepad");
15 |
16 | fluid.defaults("gamepad.searchKeyboard.searchButton", {
17 | gradeNames: ["gamepad.templateRenderer"],
18 | markup: {
19 | container: ""
20 | }
21 | });
22 |
23 | fluid.defaults("gamepad.searchKeyboard.modal", {
24 | gradeNames: ["gamepad.osk.modal.base"],
25 | model: {
26 | label: "Gamepad Navigator: Search",
27 | classNames: " gamepad-navigator-searchKeyboard"
28 | },
29 |
30 | invokers: {
31 | handleSearchButtonClick: {
32 | funcName: "gamepad.searchKeyboard.modal.handleSearchButtonClick",
33 | args: ["{that}", "{inputMapper}", "{arguments}.0"]
34 | }
35 | },
36 |
37 | components: {
38 | input: {
39 | options: {
40 | model: {
41 | composition: "{gamepad.searchKeyboard.modal}.model.inputValue"
42 | }
43 | }
44 | },
45 | searchButton: {
46 | container: "{that}.dom.modalFooter",
47 | type: "gamepad.searchKeyboard.searchButton",
48 | options: {
49 | listeners: {
50 | "onCreate.bindClick": {
51 | this: "{searchButton}.container",
52 | method: "click",
53 | args: ["{gamepad.searchKeyboard.modal}.handleSearchButtonClick"]
54 | }
55 | }
56 | }
57 | }
58 | }
59 | });
60 |
61 | gamepad.searchKeyboard.modal.handleSearchButtonClick = function (that, inputMapper, event) {
62 | that.applier.change("activeModal", false);
63 | event.preventDefault();
64 |
65 | if (that.model.inputValue && that.model.inputValue.trim().length) {
66 | var actionOptions = {
67 | action: "search",
68 | // See: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/search/query
69 | disposition: "NEW_TAB",
70 | text: that.model.inputValue.trim()
71 | };
72 |
73 | gamepad.inputMapperUtils.background.postMessage(inputMapper, actionOptions);
74 | }
75 | };
76 | })(fluid);
77 |
--------------------------------------------------------------------------------
/src/js/shared/settings.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 | /* globals chrome */
13 | (function (fluid) {
14 | "use strict";
15 | var gamepad = fluid.registerNamespace("gamepad");
16 |
17 | fluid.registerNamespace("gamepad.settings");
18 |
19 | gamepad.settings.loadSettings = async function (that) {
20 | gamepad.settings.loadPrefs(that);
21 |
22 | gamepad.settings.loadBindings(that);
23 |
24 | // In the similar function in input mapper, we add a listener for changes to values in local storage. As we
25 | // have code to ensure that there is only open settings panel, and since only the settings panel can update
26 | // stored values, we should safely be able to avoid listening for local storage changes here.
27 | };
28 |
29 | gamepad.settings.loadPrefs = async function (that) {
30 | var storedPrefs = await gamepad.utils.getStoredKey("gamepad-prefs");
31 | var prefsToSave = fluid.extend({}, gamepad.prefs.defaults, storedPrefs);
32 |
33 | var transaction = that.applier.initiate();
34 |
35 | transaction.fireChangeRequest({ path: "prefs", type: "DELETE"});
36 | transaction.fireChangeRequest({ path: "prefs", value: prefsToSave });
37 |
38 | transaction.commit();
39 | };
40 |
41 | gamepad.settings.loadBindings = async function (that) {
42 | var storedBindings = await gamepad.utils.getStoredKey("gamepad-bindings");
43 | var bindingsToSave = storedBindings || gamepad.bindings.defaults;
44 |
45 | var transaction = that.applier.initiate();
46 |
47 | transaction.fireChangeRequest({ path: "bindings", type: "DELETE"});
48 | transaction.fireChangeRequest({ path: "bindings", value: bindingsToSave });
49 |
50 | transaction.commit();
51 | };
52 |
53 | gamepad.settings.savePrefs = function (prefs) {
54 | var prefsEqualDefaults = gamepad.utils.isDeeplyEqual(gamepad.prefs.defaults, prefs);
55 | if (prefsEqualDefaults) {
56 | chrome.storage.local.remove("gamepad-prefs");
57 | }
58 | else {
59 | chrome.storage.local.set({ "gamepad-prefs": prefs });
60 | }
61 | };
62 |
63 | gamepad.settings.saveBindings = async function (bindings) {
64 | var bindingsEqualDefaults = gamepad.utils.isDeeplyEqual(gamepad.bindings.defaults, bindings);
65 | if (bindingsEqualDefaults) {
66 | chrome.storage.local.remove("gamepad-bindings");
67 | }
68 | else {
69 | chrome.storage.local.set({ "gamepad-bindings": bindings });
70 | }
71 | };
72 | })(fluid);
73 |
--------------------------------------------------------------------------------
/src/js/settings/editableSection.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 | (function (fluid) {
13 | "use strict";
14 |
15 | fluid.defaults("gamepad.settings.ui.editableSection", {
16 | gradeNames: ["gamepad.templateRenderer"],
17 | markup: {
18 | container: "35 | 36 |
37 |
41 |
49 |
%label
Gamepad Navigator Tab Navigation Tests
30 | 31 | 32 | 33 |
36 |
37 |
38 | 39 |
40 | Without tabindex
41 | 42 |
46 |
47 |
48 | 49 |
50 |
51 | 52 |
53 |
54 |
55 |
--------------------------------------------------------------------------------
/src/js/shared/utils.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 |
13 | /*
14 | Copyright (c) 2023 The Gamepad Navigator Authors
15 | See the AUTHORS.md file at the top-level directory of this distribution and at
16 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
17 |
18 | Licensed under the BSD 3-Clause License. You may not use this file except in
19 | compliance with this License.
20 |
21 | You may obtain a copy of the BSD 3-Clause License at
22 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
23 | */
24 | /* globals chrome */
25 | (function (fluid) {
26 | "use strict";
27 |
28 | var gamepad = fluid.registerNamespace("gamepad");
29 | fluid.registerNamespace("gamepad.utils");
30 |
31 | gamepad.utils.isDeeplyEqual = function (firstThing, secondThing) {
32 | if (typeof firstThing !== typeof secondThing) {
33 | return false;
34 | }
35 | else if (Array.isArray(firstThing)) {
36 | if (firstThing.length === secondThing.length) {
37 | for (var arrayIndex = 0; arrayIndex < firstThing.length; arrayIndex++) {
38 | var arrayItemsEqual = gamepad.utils.isDeeplyEqual(firstThing[arrayIndex], secondThing[arrayIndex]);
39 | if (!arrayItemsEqual) { return false; }
40 | }
41 | return true;
42 | }
43 | else {
44 | return false;
45 | }
46 | }
47 | else if (typeof firstThing === "object") {
48 | var firstThingKeys = Object.keys(firstThing);
49 | var secondThingKeys = Object.keys(secondThing);
50 |
51 | if (firstThingKeys.length !== secondThingKeys.length) {
52 | return false;
53 | }
54 |
55 | for (var keyIndex = 0; keyIndex < firstThingKeys.length; keyIndex++) {
56 | var key = firstThingKeys[keyIndex];
57 | var objectPropertiesEqual = gamepad.utils.isDeeplyEqual(firstThing[key], secondThing[key]);
58 | if (!objectPropertiesEqual) { return false; }
59 | }
60 |
61 | return true;
62 | }
63 | else {
64 | return firstThing === secondThing;
65 | }
66 | };
67 |
68 | gamepad.utils.getStoredKey = function (key) {
69 | var storagePromise = new Promise(function (resolve) {
70 | // Apparently, we have to use a callback and can't use `await` unless we make our own wrapper.
71 | chrome.storage.local.get([key], function (storedObject) {
72 | if (storedObject[key]) {
73 | resolve(storedObject[key]);
74 | }
75 | else {
76 | resolve(false);
77 | }
78 | });
79 | });
80 | return storagePromise;
81 | };
82 |
83 | })(fluid);
84 |
--------------------------------------------------------------------------------
/tests/js/tab/tab-order-tests.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 |
13 | /* global gamepad, jqUnit, ally */
14 |
15 | (function (fluid, $) {
16 | "use strict";
17 |
18 | $(document).ready(function () {
19 |
20 | fluid.registerNamespace("gamepad.tests");
21 |
22 | jqUnit.module("Gamepad Navigator Tab Navigation DOM Tests", {
23 | setup: function () {
24 | var testElementContainer = $(".test-elements");
25 | /**
26 | * Get the list of tabbable elements in the order of their tabindex for
27 | * verification.
28 | */
29 | gamepad.tests.tabbableElements = ally.query.tabsequence({ context: testElementContainer, strategy: "strict" });
30 | }
31 | });
32 |
33 | jqUnit.test("Verify the first element in the tabbable elements list.", function () {
34 | jqUnit.expect(1);
35 |
36 | // Get the first element from the tabbable elements list.
37 | var firstTabbableElement = gamepad.tests.tabbableElements[0],
38 | hasTabindexOne = firstTabbableElement.getAttribute("tabindex") === "1";
39 |
40 | jqUnit.assertTrue("The first element should have tabindex=\"1\"", hasTabindexOne);
41 | });
42 |
43 | jqUnit.test("Verify the last element in the tabbable elements list.", function () {
44 | jqUnit.expect(1);
45 |
46 | // Get the last element from the tabbable elements list.
47 | var lastTabbableElement = gamepad.tests.tabbableElements[gamepad.tests.tabbableElements.length - 1],
48 | isLastElement = lastTabbableElement.getAttribute("id") === "last";
49 |
50 | jqUnit.assertTrue("The first element should be the last div with id=\"last\"", isLastElement);
51 | });
52 |
53 | jqUnit.test("Verify presence and absence of elements according to their tabindex value.", function () {
54 | jqUnit.expect(2);
55 |
56 | // Check if the tabbable elements list contains elements with tabindex="-1".
57 | var elementWithNegativeTabindex = $("button[tabindex=\"-1\"]"),
58 | hasElementWithNegativeTabindex = gamepad.tests.tabbableElements.includes(elementWithNegativeTabindex[0]);
59 | jqUnit.assertFalse("The sorted elements array should not contain elements with tabindex=\"-1\"", hasElementWithNegativeTabindex);
60 |
61 | // Check if the tabbable elements list contains elements with tabindex="0".
62 | var elementWithTabindexZero = $("div[tabindex=\"0\"]"),
63 | hasElementWithTabindexZero = gamepad.tests.tabbableElements.includes(elementWithTabindexZero[0]);
64 | jqUnit.assertTrue("The sorted elements array should contain elements with tabindex=\"0\"", hasElementWithTabindexZero);
65 | });
66 | });
67 | })(fluid, jQuery);
68 |
--------------------------------------------------------------------------------
/src/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Gamepad Navigator",
3 | "version": "1.0.0",
4 | "description": "A Chrome extension that allows you to navigate web pages and Chromium-based browsers using a game controller.",
5 | "author": "The Gamepad Navigator Authors",
6 | "manifest_version": 3,
7 | "permissions": [
8 | "storage",
9 | "tabs",
10 | "sessions",
11 | "search"
12 | ],
13 | "content_scripts": [
14 | {
15 | "matches": [
16 | "38 | 39 |
40 | Without tabindex
41 | 42 |
46 |
Five (tabindex=5)
47 |
48 | 49 |
50 |
Last (div with tabindex=0)
51 | 52 |
71 | 
72 |
73 |
75 |
76 |
72 |
73 | Gamepad Navigator Settings
74 |
77 |
78 |
79 |
80 |
--------------------------------------------------------------------------------
/tests/js/scroll/scroll-bidirectional-oneaxes-tests.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 |
13 | /* global gamepad, jqUnit */
14 |
15 | (function (fluid, $) {
16 | "use strict";
17 |
18 | $(document).ready(function () {
19 |
20 | fluid.registerNamespace("gamepad");
21 | fluid.registerNamespace("gamepad.tests");
22 |
23 | gamepad.tests.windowObject = window;
24 | gamepad.tests.delayMs = 250;
25 |
26 | jqUnit.module("Gamepad Navigator Bidirectional One-axis Scrolling Tests");
27 |
28 | jqUnit.test("Scroll horizontally", function () {
29 | jqUnit.expect(3);
30 |
31 | // Initialize the webpage, i.e., scroll the page to the left.
32 | $(window).scrollLeft(0);
33 |
34 | var inputMapper = gamepad.tests.scroll.inputMapper();
35 |
36 | jqUnit.assertEquals("The initial horizontal scroll position should not be changed.", 0, window.scrollX);
37 |
38 | // Update the gamepad to tilt the axes for scrolling.
39 | inputMapper.applier.change("axes.0", 1);
40 |
41 | jqUnit.stop();
42 |
43 | // Wait for a few milliseconds for the webpage to scroll.
44 | setTimeout(function () {
45 | jqUnit.start();
46 |
47 | jqUnit.assertNotEquals("The page should have been scrolled towards the right.", 0, window.scrollX);
48 | var previousXCoordinate = window.scrollX;
49 |
50 | // Update the gamepad to tilt the axes in the opposite direction.
51 | inputMapper.applier.change("axes.0", 0);
52 | inputMapper.applier.change("axes.0", -1);
53 |
54 | // Return the current horizontal position of scroll for further testing.
55 | jqUnit.stop();
56 |
57 | // Wait for a few milliseconds for the webpage to scroll.
58 | setTimeout(function () {
59 | jqUnit.start();
60 |
61 | // Check if the webpage has scrolled towards the left.
62 | jqUnit.assertNotEquals("The page should have been scrolled towards the left.", previousXCoordinate, window.scrollX);
63 | }, gamepad.tests.delayMs);
64 | }, gamepad.tests.delayMs);
65 | });
66 |
67 | jqUnit.test("Scroll vertically", function () {
68 | jqUnit.expect(3);
69 |
70 | // Initialize the webpage, i.e., scroll the page to the top.
71 | $(window).scrollTop(0);
72 |
73 | var inputMapper = gamepad.tests.scroll.inputMapper();
74 |
75 | jqUnit.assertEquals("The initial vertical scroll position should not be changed.", 0, window.scrollY);
76 |
77 | // Update the gamepad to tilt the axes for scrolling.
78 | inputMapper.applier.change("axes.1", 1);
79 |
80 | jqUnit.stop();
81 |
82 | setTimeout(function () {
83 | jqUnit.start();
84 |
85 | jqUnit.assertNotEquals("The page should have been scrolled down.", 0, window.scrollY);
86 |
87 | var previousYCoordinate = window.scrollY;
88 |
89 | // Update the gamepad to tilt the axes in the opposite direction.
90 | inputMapper.applier.change("axes.1", 0);
91 | inputMapper.applier.change("axes.1", -1);
92 |
93 | jqUnit.stop();
94 |
95 | // Wait for a few milliseconds for the webpage to scroll.
96 | setTimeout(function () {
97 | jqUnit.start();
98 |
99 | // Check if the webpage has scrolled up.
100 | jqUnit.assertNotEquals("The page should have been scrolled up.", previousYCoordinate, window.scrollY);
101 | }, gamepad.tests.delayMs);
102 | }, gamepad.tests.delayMs);
103 | });
104 | });
105 | })(fluid, jQuery);
106 |
--------------------------------------------------------------------------------
/src/js/content_scripts/keyboards.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 | /* globals osk */
13 | (function (fluid) {
14 | "use strict";
15 |
16 | var gamepad = fluid.registerNamespace("gamepad");
17 |
18 | fluid.defaults("gamepad.osk.keyboard.text", {
19 | gradeNames: ["osk.keyboard"],
20 | rowDefs: [
21 | [osk.keydefsByCode.Backquote, osk.keydefsByCode.Digit1, osk.keydefsByCode.Digit2, osk.keydefsByCode.Digit3, osk.keydefsByCode.Digit4, osk.keydefsByCode.Digit5, osk.keydefsByCode.Digit6, osk.keydefsByCode.Digit7, osk.keydefsByCode.Digit8, osk.keydefsByCode.Digit9, osk.keydefsByCode.Digit0, osk.keydefsByCode.Minus, osk.keydefsByCode.Equal, osk.keydefsByCode.Backspace],
22 | [osk.keydefsByCode.KeyQ, osk.keydefsByCode.KeyW, osk.keydefsByCode.KeyE, osk.keydefsByCode.KeyR, osk.keydefsByCode.KeyT, osk.keydefsByCode.KeyY, osk.keydefsByCode.KeyU, osk.keydefsByCode.KeyI, osk.keydefsByCode.KeyO, osk.keydefsByCode.KeyP, osk.keydefsByCode.BracketLeft, osk.keydefsByCode.BracketRight, osk.keydefsByCode.Slash, osk.keydefsByCode.ArrowLeft, osk.keydefsByCode.ArrowRight],
23 | [osk.keydefsByCode.KeyA, osk.keydefsByCode.KeyS, osk.keydefsByCode.KeyD, osk.keydefsByCode.KeyF, osk.keydefsByCode.KeyG, osk.keydefsByCode.KeyH, osk.keydefsByCode.KeyJ, osk.keydefsByCode.KeyK, osk.keydefsByCode.KeyL, osk.keydefsByCode.Semicolon, osk.keydefsByCode.Quote, osk.keydefsByCode.Enter],
24 | [osk.keydefsByCode.KeyZ, osk.keydefsByCode.KeyX, osk.keydefsByCode.KeyC, osk.keydefsByCode.KeyV, osk.keydefsByCode.KeyB, osk.keydefsByCode.KeyN, osk.keydefsByCode.KeyM, osk.keydefsByCode.Comma, osk.keydefsByCode.Period, osk.keydefsByCode.ShiftRight, osk.keydefsByCode.CapsLock ],
25 | [osk.keydefsByCode.Space]
26 | ]
27 | });
28 |
29 |
30 | fluid.registerNamespace("gamepad.osk.keyboard.numpad");
31 |
32 | // Key definitions for the number pad that don't use the shift key or labels.
33 | gamepad.osk.keyboard.numpad.keydefs = {
34 | Backspace: { code: "Backspace", label: "Back", gradeNames: ["osk.key.noShiftLabel"], action: "backspace"},
35 | Comma: { code: "Comma", label: ",", gradeNames: ["osk.key.noShiftLabel"] },
36 | Digit0: { code: "Digit0", label: "0", gradeNames: ["osk.key.noShiftLabel"] },
37 | Digit1: { code: "Digit1", label: "1", gradeNames: ["osk.key.noShiftLabel"] },
38 | Digit2: { code: "Digit2", label: "2", gradeNames: ["osk.key.noShiftLabel"] },
39 | Digit3: { code: "Digit3", label: "3", gradeNames: ["osk.key.noShiftLabel"] },
40 | Digit4: { code: "Digit4", label: "4", gradeNames: ["osk.key.noShiftLabel"] },
41 | Digit5: { code: "Digit5", label: "5", gradeNames: ["osk.key.noShiftLabel"] },
42 | Digit6: { code: "Digit6", label: "6", gradeNames: ["osk.key.noShiftLabel"] },
43 | Digit7: { code: "Digit7", label: "7", gradeNames: ["osk.key.noShiftLabel"] },
44 | Digit8: { code: "Digit8", label: "8", gradeNames: ["osk.key.noShiftLabel"] },
45 | Digit9: { code: "Digit9", label: "9", gradeNames: ["osk.key.noShiftLabel"] },
46 | Period: { code: "Period", label: ".", gradeNames: ["osk.key.noShiftLabel"]}
47 |
48 | };
49 |
50 | fluid.defaults("gamepad.osk.keyboard.numpad", {
51 | gradeNames: ["osk.keyboard"],
52 | rowDefs: [
53 | [gamepad.osk.keyboard.numpad.keydefs.Digit1, gamepad.osk.keyboard.numpad.keydefs.Digit2, gamepad.osk.keyboard.numpad.keydefs.Digit3, gamepad.osk.keyboard.numpad.keydefs.Digit4, gamepad.osk.keyboard.numpad.keydefs.Digit5],
54 | [gamepad.osk.keyboard.numpad.keydefs.Digit6, gamepad.osk.keyboard.numpad.keydefs.Digit7, gamepad.osk.keyboard.numpad.keydefs.Digit8, gamepad.osk.keyboard.numpad.keydefs.Digit9, gamepad.osk.keyboard.numpad.keydefs.Digit0 ],
55 | [gamepad.osk.keyboard.numpad.keydefs.Comma, gamepad.osk.keyboard.numpad.keydefs.Period, osk.keydefsByCode.ArrowLeft, osk.keydefsByCode.ArrowRight, gamepad.osk.keyboard.numpad.keydefs.Backspace ]
56 | ]
57 | });
58 |
59 | })(fluid);
60 |
--------------------------------------------------------------------------------
/src/js/settings/selectInput.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 | (function (fluid) {
13 | "use strict";
14 |
15 | var gamepad = fluid.registerNamespace("gamepad");
16 |
17 | fluid.defaults("gamepad.ui.select", {
18 | gradeNames: ["gamepad.templateRenderer"],
19 | markup: {
20 | container: "\n\n
",
21 | noneOption: "\n",
22 | option: "\n"
23 | },
24 | selectors: {
25 | select: ".gamepad-select-input-input"
26 | },
27 | model: {
28 | noneOption: false,
29 | noneDescription: "Select an option",
30 |
31 | selectedChoice: false,
32 | // Should be a map of "value": "text description"
33 | choices: {
34 | }
35 | },
36 | modelRelay: [
37 | {
38 | source: "{that}.model.dom.select.value",
39 | target: "{that}.model.selectedChoice"
40 | }
41 | ],
42 | modelListeners: {
43 | choices: {
44 | funcName: "gamepad.ui.select.renderOptions",
45 | args: ["{that}.dom.select", "{that}.options.markup.option", "{that}.model.choices", "{that}.model.selectedChoice", "{that}.model.noneOption", "{that}.options.markup.noneOption", "{that}.model.noneDescription"] // selectInputElement, optionTemplate, choices, selectedChoice, hasNoneOption, noneOptionTemplate, noneDescription
46 | }
47 | }
48 | });
49 |
50 | gamepad.ui.select.renderOptions = function (selectInputElement, optionTemplate, choices, selectedChoice, hasNoneOption, noneOptionTemplate, noneDescription) {
51 | var renderedText = "";
52 |
53 | if (hasNoneOption) {
54 | var noneOptionText = fluid.stringTemplate(noneOptionTemplate, { noneDescription });
55 | renderedText += noneOptionText;
56 | }
57 |
58 | fluid.each(choices, function (description, value) {
59 | var selected = (value === selectedChoice) ? " selected" : "";
60 | var singleOptionText = fluid.stringTemplate(optionTemplate, { selected, description, value});
61 | renderedText += singleOptionText;
62 | });
63 |
64 | $(selectInputElement).html(renderedText);
65 | };
66 |
67 | fluid.defaults("gamepad.ui.bindingParam.selectInput", {
68 | gradeNames: ["gamepad.templateRenderer"],
69 | model: {
70 | label: "Select",
71 | description: ""
72 | },
73 | markup: {
74 | container:
75 | "\n" +
76 | "\tForm Field Test Page
5 |
6 |
7 |
8 |
9 |
10 |
11 | Radio Buttons
72 |
73 |
Advanced Focus Tester
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 | ",
21 | item: "} items - A hash of items. Each property can either be a string (description) or an object with a description property.
77 | *
78 | */
79 | gamepad.ui.listSelector.renderItems = function (that, enclosingElement, items) {
80 | enclosingElement.empty();
81 |
82 | fluid.each(items, function (item, itemIndex) {
83 | var template = that.options.markup.item;
84 |
85 | var itemObject = typeof item === "string" ? { description: item } : item;
86 | itemObject.classNames = itemObject.selected ? " gamepad-list-selector-item--selected" : "";
87 | var itemMarkup = fluid.stringTemplate(template, itemObject);
88 | var itemElement = $(itemMarkup);
89 |
90 | itemElement.on("click", function (event) {
91 | event.preventDefault();
92 |
93 | that.handleItemClick(itemIndex, event);
94 | });
95 |
96 | itemElement.on("keydown", function (event) {
97 | if (["Enter", "Space"].includes(event.code)) {
98 | event.preventDefault();
99 | that.handleItemClick(itemIndex, event);
100 | }
101 | });
102 |
103 | enclosingElement.append(itemElement);
104 |
105 | that.handleFocusChange();
106 | });
107 | };
108 |
109 | gamepad.ui.listSelector.handleFocusChange = function (that) {
110 | var activeItems = that.locate("activeItems");
111 |
112 | var useArrows = fluid.get(that, "model.prefs.arrowModals") || false;
113 |
114 | for (var itemIndex = 0; itemIndex < activeItems.length; itemIndex++) {
115 | var itemElement = activeItems[itemIndex];
116 | if (useArrows && itemIndex !== that.model.focusedItemIndex) {
117 | itemElement.setAttribute("tabindex", -1);
118 | }
119 | else {
120 | itemElement.setAttribute("tabindex", 0);
121 | }
122 | }
123 |
124 | var toFocus = fluid.get(activeItems, that.model.focusedItemIndex);
125 | if (toFocus) {
126 | toFocus.focus();
127 | }
128 | };
129 |
130 | gamepad.ui.listSelector.handleKeydown = function (that, event) {
131 | if (["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"].includes(event.code)) {
132 | event.preventDefault();
133 |
134 | var lastItemIndex = (Object.keys(that.model.items).length - 1);
135 |
136 | switch (event.code) {
137 | case "ArrowLeft":
138 | case "ArrowUp":
139 | var previousItemIndex = that.model.focusedItemIndex > 0 ? that.model.focusedItemIndex - 1 : lastItemIndex;
140 | that.applier.change("focusedItemIndex", previousItemIndex);
141 | break;
142 | case "ArrowRight":
143 | case "ArrowDown":
144 | var nextItemIndex = that.model.focusedItemIndex < lastItemIndex ? that.model.focusedItemIndex + 1 : 0;
145 | that.applier.change("focusedItemIndex", nextItemIndex);
146 | break;
147 | }
148 | }
149 | };
150 | })(fluid);
151 |
--------------------------------------------------------------------------------
%label
\n" +
77 | "\t\n" +
78 | "\t
\n"
81 | },
82 | selectors: {
83 | select: ".gamepad-select-input-container"
84 | },
85 | components: {
86 | select: {
87 | container: "{that}.dom.select",
88 | type: "gamepad.ui.select",
89 | options: {
90 | model: {
91 | choices: "{gamepad.ui.bindingParam.selectInput}.model.choices",
92 | noneDescription: "{gamepad.ui.bindingParam.selectInput}.model.noneDescription",
93 | noneOption: "{gamepad.ui.bindingParam.selectInput}.model.noneOption",
94 | selectedChoice: "{gamepad.ui.bindingParam.selectInput}.model.selectedChoice"
95 | }
96 | }
97 | }
98 | }
99 | });
100 | })(fluid);
101 |
--------------------------------------------------------------------------------
/src/js/content_scripts/input-mapper-background-utils.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 |
13 | /* global gamepad, chrome */
14 |
15 | (function (fluid) {
16 | "use strict";
17 |
18 | fluid.registerNamespace("gamepad.inputMapperUtils.background");
19 |
20 | // TODO: Add continuous / long-press browser tab navigation, if needed.
21 | // TODO: Add browser tab navigation for thumbsticks.
22 |
23 | /**
24 | *
25 | * Connect to the background script, send a message, and handle the response.
26 | *
27 | * @param {Object} that - The inputMapper component.
28 | * @param {String} actionOptions - The action payload to be transmitted.
29 | *
30 | */
31 | gamepad.inputMapperUtils.background.postMessage = async function (that, actionOptions) {
32 | // We use this because chrome.runtime.sendMessage did not leave enough time to receive a response.
33 | var port = chrome.runtime.connect();
34 | port.onMessage.addListener(function (response) {
35 | var vibrate = fluid.get(response, "vibrate");
36 | if (vibrate) {
37 | that.vibrate();
38 | }
39 | });
40 |
41 | var wrappedActionOptions = fluid.copy(actionOptions);
42 |
43 | wrappedActionOptions.newTabOrWindowURL = that.model.prefs.newTabOrWindowURL;
44 |
45 | // Set the left pixel if the action is about changing "window size".
46 | if (actionOptions.action === "maximizeWindow" || actionOptions.action === "restoreWindowSize") {
47 | wrappedActionOptions.left = screen.availLeft;
48 | }
49 |
50 | port.postMessage(wrappedActionOptions);
51 | };
52 |
53 | /**
54 | *
55 | * Sends message to the background script to zoom in/out on the webpage using
56 | * thumbsticks.
57 | *
58 | * @param {Object} that - The inputMapper component.
59 | * @param {Object} actionOptions - The parameters for this action.
60 | * @property {Boolean} invert - Whether the zooming should be in opposite order.
61 | * @param {String} inputType - The input type ("buttons" or "axes").
62 | * @param {String|Number} index - Which button number or axis we're responding to.
63 | *
64 | */
65 | gamepad.inputMapperUtils.background.thumbstickZoom = async function (that, actionOptions, inputType, index) {
66 | var inversionFactor = fluid.get(actionOptions, "invert") ? -1 : 1;
67 |
68 | var value = fluid.get(that.model, [inputType, index]);
69 |
70 | var polarisedValue = value * inversionFactor;
71 | var zoomType = polarisedValue > 0 ? "zoomOut" : "zoomIn";
72 |
73 | var delegatedActionOptions = fluid.copy(actionOptions);
74 | delegatedActionOptions.action = zoomType;
75 | gamepad.inputMapperUtils.background.postMessage(that, delegatedActionOptions);
76 | };
77 |
78 | /**
79 | *
80 | * Sends message to the background script to change the current window size using
81 | * thumbsticks.
82 | *
83 | * @param {Object} that - The inputMapper component.
84 | * @param {Object} actionOptions - The parameters for this action.
85 | * @property {Boolean} invert - Whether the zooming should be in opposite order.
86 | * @param {String} inputType - The input type ("buttons" or "axes").
87 | * @param {String|Number} index - Which button number or axis we're responding to.
88 | *
89 | */
90 | gamepad.inputMapperUtils.background.thumbstickWindowSize = function (that, actionOptions, inputType, index) {
91 | var invert = fluid.get(actionOptions, "invert") || false;
92 |
93 | var value = fluid.get(that.model, [inputType, index]);
94 |
95 | var inversionFactor = invert ? -1 : 1;
96 | var polarisedValue = value * inversionFactor;
97 |
98 | var delegatedAction = polarisedValue > 0 ? "maximizeWindow" : "restoreWindowSize";
99 |
100 | var delegatedActionOptions = {
101 | action: delegatedAction,
102 | left: screen.availLeft
103 | };
104 | gamepad.inputMapperUtils.background.postMessage(that, delegatedActionOptions);
105 | };
106 | })(fluid);
107 |
--------------------------------------------------------------------------------
/tests/html/form-fields.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | %description
\n" +
79 | "\t\n
\n" +
80 | "Form Field Test Page
12 | 13 |This page provides many examples of form elements, so that we can test them with the gamepad navigator.
14 | 15 |Text Inputs
16 | 17 |These inputs should be editable with the onscreen keyboard.
18 | 19 |Input with No Type
20 | 21 | 22 | 23 |Text Input
24 | 25 | 26 | 27 |Search Input
28 | 29 | 30 | 31 |Email Input
32 | 33 | 34 | 35 |Password Input
36 | 37 | 38 | 39 |Telephone Number Input
40 | 41 | 42 | 43 |URL input
44 | 45 | 46 | 47 |Text Area
48 | 49 | 50 | 51 |Number Inputs
52 | 53 |Number inputs should be controllable using arrow keys (which are bound to the d-pad by default)
54 | 55 |Number Input, No Parameters
56 | 57 | 58 | 59 |Number Input with Max / Min / Step
60 | 61 | 62 | 63 |Range Input
64 | 65 | 66 | 67 |"Decimal" Input Mode
68 | 69 | 70 | 71 |Radio Buttons
72 |
73 | No Radio Group, Nothing Selected
74 |
75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 |
84 |
85 |
86 | No Radio Group, Button Selected
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 | Select Boxes
100 |
101 |
Select boxes should open with the "select operator" modal.
102 | 103 |Select Input, Nothing Selected
104 | 105 | 110 | 111 |Select Input, Value Selected
112 | 113 | 118 | 119 |Select Input, Disabled Value Selected
120 | 121 | 127 | 128 |Multi Select
129 | 130 | 135 | 136 |Custom Select Input
137 | 138 | 139 | 140 | 155 | 156 | 157 | 158 | -------------------------------------------------------------------------------- /tests/js/scroll/scroll-unidirectional-axes-tests.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2023 The Gamepad Navigator Authors 3 | See the AUTHORS.md file at the top-level directory of this distribution and at 4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md. 5 | 6 | Licensed under the BSD 3-Clause License. You may not use this file except in 7 | compliance with this License. 8 | 9 | You may obtain a copy of the BSD 3-Clause License at 10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE 11 | */ 12 | 13 | /* global gamepad, jqUnit */ 14 | 15 | (function (fluid, $) { 16 | "use strict"; 17 | 18 | $(document).ready(function () { 19 | 20 | fluid.registerNamespace("gamepad"); 21 | fluid.registerNamespace("gamepad.tests"); 22 | 23 | gamepad.tests.delayMs = 250; 24 | 25 | jqUnit.module("Gamepad Navigator Unidirectional Axes Scrolling Tests"); 26 | 27 | jqUnit.test("Scroll down using axes input", function () { 28 | jqUnit.expect(2); 29 | 30 | // Initialize the webpage, i.e., scroll the page to the top. 31 | $(window).scrollTop(0); 32 | 33 | var inputMapper = gamepad.tests.scroll.inputMapper(); 34 | 35 | jqUnit.assertEquals("The initial vertical scroll position should not be changed.", 0, window.scrollY); 36 | 37 | // Update the gamepad to tilt axes 1 for for scrolling. 38 | inputMapper.applier.change("axes.1", 1); 39 | 40 | jqUnit.stop(); 41 | 42 | // Wait for a few milliseconds for the webpage to scroll. 43 | setTimeout(function () { 44 | jqUnit.start(); 45 | 46 | // Check if the gamepad has scrolled down. 47 | jqUnit.assertNotEquals("The page should have scrolled down.", 0, window.scrollY); 48 | }, gamepad.tests.delayMs); 49 | }); 50 | 51 | jqUnit.test("Scroll up using axes input", function () { 52 | jqUnit.expect(2); 53 | 54 | // Initialize the webpage, i.e., scroll the page towards the bottom. 55 | $(window).scrollTop(400); 56 | 57 | var inputMapper = gamepad.tests.scroll.inputMapper(); 58 | 59 | jqUnit.assertEquals("The initial vertical scroll position should not be changed.", 400, window.scrollY); 60 | 61 | // Update the gamepad to tilt axes 1 for for scrolling. 62 | inputMapper.applier.change("axes.1", -1); 63 | 64 | jqUnit.stop(); 65 | 66 | // Wait for a few milliseconds for the webpage to scroll. 67 | setTimeout(function () { 68 | jqUnit.start(); 69 | 70 | // Check if the gamepad has scrolled up. 71 | var hasScrolledUp = window.scrollY < 400; 72 | jqUnit.assertTrue("The page should have scrolled up.", hasScrolledUp); 73 | }, gamepad.tests.delayMs); 74 | }); 75 | 76 | jqUnit.test("Scroll right using axes input", function () { 77 | jqUnit.expect(2); 78 | 79 | // Initialize the webpage, i.e., scroll the page to the left. 80 | $(window).scrollLeft(0); 81 | 82 | var inputMapper = gamepad.tests.scroll.inputMapper(); 83 | 84 | jqUnit.assertEquals("The horizontal vertical scroll position should not be changed.", 0, window.scrollX); 85 | 86 | // Update the gamepad to tilt axes 0 for for scrolling. 87 | inputMapper.applier.change("axes.0", 1); 88 | 89 | jqUnit.stop(); 90 | 91 | // Wait for a few milliseconds for the webpage to scroll. 92 | setTimeout(function () { 93 | jqUnit.start(); 94 | 95 | // Check if the gamepad has scrolled towards the right. 96 | jqUnit.assertNotEquals("The page should have scrolled right.", 0, window.scrollX); 97 | }, gamepad.tests.delayMs); 98 | }); 99 | 100 | jqUnit.test("Scroll left using axes input", function () { 101 | jqUnit.expect(2); 102 | 103 | // Initialize the webpage, i.e., scroll the page towards the right. 104 | $(window).scrollLeft(400); 105 | 106 | var inputMapper = gamepad.tests.scroll.inputMapper(); 107 | 108 | jqUnit.assertEquals("The horizontal vertical scroll position should not be changed.", 400, window.scrollX); 109 | 110 | // Update the gamepad to tilt axes 0 for for scrolling. 111 | inputMapper.applier.change("axes.0", -1); 112 | 113 | jqUnit.stop(); 114 | 115 | // Wait for a few milliseconds for the webpage to scroll. 116 | setTimeout(function () { 117 | jqUnit.start(); 118 | 119 | // Check if the gamepad has scrolled towards the left. 120 | var hasScrolledLeft = window.scrollX < 400; 121 | jqUnit.assertTrue("The page should have scrolled left.", hasScrolledLeft); 122 | }, gamepad.tests.delayMs); 123 | }); 124 | }); 125 | })(fluid, jQuery); 126 | -------------------------------------------------------------------------------- /docs/components/navigator.md: -------------------------------------------------------------------------------- 1 | 12 | 13 | # `gamepad.navigator` 14 | 15 | This component listens to the `gamepadconnected` and `gamepaddisconnected` events in the browser. When at least one 16 | gamepad is connected, it reads inputs from them at a particular frequency and stores those input values in the 17 | component's model data. The component stops reading these inputs when the last gamepad is disconnected. 18 | 19 | ## Using this grade 20 | 21 | You can change the configuration options by either extending the component or by passing your own options. If no 22 | options are passed, the defaults are used. 23 | 24 | ``` javascript 25 | // Either create an instance of the navigator. 26 | var navigatorInstanceOne = gamepad.navigator(); 27 | 28 | // Otherwise create a custom component using the navigator grade. 29 | fluid.defaults("my.navigator.grade", { 30 | gradeNames: ["gamepad.navigator"] 31 | }); 32 | var navigatorInstanceTwo = my.navigator.grade(); 33 | ``` 34 | 35 | ## Component Options 36 | 37 | The following component configuration options are supported: 38 | 39 | | Option | Type | Default Value | Description | 40 | | :---: | :---: | :---: | :--- | 41 | | `windowObject` | `{Object}` | `window` | The global window object from which the navigator derives various methods to read gamepad inputs and attach listeners to it for various gamepad events. | 42 | | `frequency` | `{Integer}` | 50 | The frequency (in ms) at which the navigator will read gamepad inputs. | 43 | 44 | These options can be provided to the component in the following ways: 45 | 46 | ```javascript 47 | // Either pass the options inside the object as an argument while creating an instance of the navigator. 48 | var navigatorInstanceOne = gamepad.navigator({ 49 | windowObject: myCustomWindowObject, 50 | frequency: 100 51 | }); 52 | 53 | // Otherwise pass it as default options in a custom component using the navigator grade. 54 | fluid.defaults("my.navigator.grade", { 55 | gradeNames: ["gamepad.navigator"], 56 | windowObject: myCustomWindowObject, 57 | frequency: 100 58 | }); 59 | var navigatorInstanceTwo = my.navigator.grade(); 60 | ``` 61 | 62 | Though the `windowObject` is a configurable option, it should have all the properties and methods that the navigator 63 | uses. Otherwise, the navigator won't work and will throw errors. You can also use a modified `window` object, such as 64 | the gamepad mocks used in this package's tests, and pass it into the component if you want to achieve a different 65 | behavior. That'll be less likely to throw errors. 66 | 67 | ## Invokers 68 | 69 | ### `{navigator}.attachListener()` 70 | 71 | - Returns: Nothing. 72 | 73 | Attaches event listeners to the `windowObject` for the `gamepadconnected` and `gamepaddisconnected` events. When these 74 | events are fired, the navigator fires its native `onGamepadConnected` or `onGamepadDisconnected` events, depending upon 75 | the former event. These events have listeners attached to it, which start reading the gamepad inputs or stop reading it 76 | further. 77 | 78 | ### `{navigator}.onConnected()` 79 | 80 | - Returns: Nothing. 81 | 82 | Listens for the gamepad navigator component's event `onGamepadConnected`. When it is called, it initiates the gamepad 83 | polling invoker [`{navigator}.pollGamepads`](#navigatorpollgamepads) to be called at the same frequency as specified in 84 | the component's configurable option `frequency`. The interval ID is stored in the component's member 85 | `connectivityIntervalReference` for reference in other invokers and listeners present in the component. 86 | 87 | ### `{navigator}.pollGamepads()` 88 | 89 | - Returns: Nothing. 90 | 91 | Called periodically to read the gamepad inputs and to update the navigator component's model with those values. The 92 | inputs are read from all the connected gamepads and then combine them to provide the co-pilot mode experience. 93 | 94 | ### `{navigator}.onDisconnected()` 95 | 96 | - Returns: Nothing. 97 | 98 | Listens for the gamepad navigator component's event `onGamepadDisconnected`. When it is called, it stops the polling 99 | function interval loop and then checks whether any gamepad is still connected. If any gamepad is found connected, it 100 | will fire the `onGamepadConnected` event so that the navigator continues to read gamepad inputs. Otherwise, the 101 | navigator will restore the component's model to its initial state (when no gamepad was connected). 102 | 103 | ### `{navigator}.clearConnectivityInterval()` 104 | 105 | - Returns: Nothing. 106 | 107 | Listens for the navigator component's `onDestroy` event and will clear the polling function interval loop when called. 108 | -------------------------------------------------------------------------------- /tests/html/advanced-focus.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |Advanced Focus Tester
13 | 14 |15 | This page demonstrates a range of advanced elements to confirm whether 16 | we can navigate to and control them. 17 |
18 | 19 |Simple Elements
20 | 21 |22 | Here are a few simple elements that we can easily work with. We use 23 | these to ensure that our approach to advanced elements does not break 24 | handling of simple elements. 25 |
26 | 27 |28 | Here is a normal link (to 29 | wikipedia), which should be reachable via tab navigation. 30 |
31 | 32 |33 | Here is an internal link (to the shadow content 34 | section), which should also be tabbable. 35 |
36 | 37 | 38 | 39 | 40 | 41 |Media
42 | 43 |44 | Specialised controls like <video> elements also make use of a 45 | shadow root, but do not expose their internals. We have a preference 46 | (enabled by default) to expose controls automatically. Clicking a 47 | media element with its controls exposed should play or pause. 48 |
49 | 50 |Video, Controls Enabled by Default
51 | 52 | 55 | 56 |Video, Controls Disabled by Default
57 | 58 | 61 | 62 |Shadow Content
63 | 64 |65 | Some elements make use of a "shadow root" to store their associated DOM 66 | elements. These cannot be found using many query strategies, and it is 67 | important that we find them and any "tabbable" sub-elements. This page 68 | provides a mix of normal and shadow elements to test tab focus. 69 |
70 | 71 |Shadow Content, Open Container
72 | 73 | 74 | 75 |Shadow Content, Closed Container
76 | 77 | 78 | 79 |IFrame Content
80 | 81 |There are also <iframe> elements, which present their own challenges.
82 | 83 | 84 | 85 | 132 | 133 | -------------------------------------------------------------------------------- /tests/js/scroll/scroll-unidirectional-button-tests.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2023 The Gamepad Navigator Authors 3 | See the AUTHORS.md file at the top-level directory of this distribution and at 4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md. 5 | 6 | Licensed under the BSD 3-Clause License. You may not use this file except in 7 | compliance with this License. 8 | 9 | You may obtain a copy of the BSD 3-Clause License at 10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE 11 | */ 12 | 13 | /* global gamepad, jqUnit */ 14 | 15 | (function (fluid, $) { 16 | "use strict"; 17 | 18 | $(document).ready(function () { 19 | 20 | fluid.registerNamespace("gamepad"); 21 | fluid.registerNamespace("gamepad.tests"); 22 | 23 | gamepad.tests.windowObject = window; 24 | gamepad.tests.delayMs = 250; 25 | 26 | jqUnit.module("Gamepad Navigator Unidirectional Button Scrolling Tests"); 27 | 28 | jqUnit.test("Scroll down using button input", function () { 29 | jqUnit.expect(2); 30 | 31 | // Initialize the webpage, i.e., scroll the page to the top. 32 | $(window).scrollTop(0); 33 | 34 | var inputMapper = gamepad.tests.scroll.inputMapper(); 35 | 36 | jqUnit.assertEquals("The initial vertical scroll position should not be changed.", 0, window.scrollY); 37 | 38 | // Update the gamepad to press button 13 for scrolling. 39 | inputMapper.applier.change("buttons.13", 1); 40 | 41 | jqUnit.stop(); 42 | 43 | // Wait for a few milliseconds for the webpage to scroll. 44 | setTimeout(function () { 45 | jqUnit.start(); 46 | 47 | // Check if the gamepad has scrolled down. 48 | jqUnit.assertNotEquals("The page should have scrolled down.", 0, window.scrollY); 49 | }, gamepad.tests.delayMs); 50 | }); 51 | 52 | jqUnit.test("Scroll up using button input", function () { 53 | jqUnit.expect(2); 54 | 55 | // Initialize the webpage, i.e., scroll the page towards the bottom. 56 | $(window).scrollTop(400); 57 | 58 | jqUnit.assertEquals("The initial vertical scroll position should not be changed.", 400, window.scrollY); 59 | 60 | var inputMapper = gamepad.tests.scroll.inputMapper(); 61 | 62 | // Update the gamepad to press button 12 for scrolling. 63 | inputMapper.applier.change("buttons.12", 1); 64 | 65 | jqUnit.stop(); 66 | 67 | // Wait for a few milliseconds for the webpage to scroll. 68 | setTimeout(function () { 69 | jqUnit.start(); 70 | 71 | // Check if the gamepad has scrolled up. 72 | var hasScrolledUp = window.scrollY < 400; 73 | jqUnit.assertTrue("The page should have scrolled up.", hasScrolledUp); 74 | }, gamepad.tests.delayMs); 75 | }); 76 | 77 | jqUnit.test("Scroll right using button input", function () { 78 | jqUnit.expect(2); 79 | 80 | // Initialize the webpage, i.e., scroll the page to the left. 81 | $(window).scrollLeft(0); 82 | 83 | var inputMapper = gamepad.tests.scroll.inputMapper(); 84 | 85 | jqUnit.assertEquals("The horizontal vertical scroll position should not be changed.", 0, window.scrollX); 86 | 87 | // Update the gamepad to press button 15 for scrolling. 88 | inputMapper.applier.change("buttons.15", 1); 89 | 90 | jqUnit.stop(); 91 | 92 | // Wait for a few milliseconds for the webpage to scroll. 93 | setTimeout(function () { 94 | jqUnit.start(); 95 | 96 | // Check if the gamepad has scrolled towards the right. 97 | jqUnit.assertNotEquals("The page should have scrolled right.", 0, window.scrollX); 98 | }, gamepad.tests.delayMs); 99 | }); 100 | 101 | jqUnit.test("Scroll left using button input", function () { 102 | jqUnit.expect(2); 103 | 104 | // Initialize the webpage, i.e., scroll the page towards the right. 105 | $(window).scrollLeft(400); 106 | 107 | var inputMapper = gamepad.tests.scroll.inputMapper(); 108 | 109 | jqUnit.assertEquals("The horizontal vertical scroll position should not be changed.", 400, window.scrollX); 110 | 111 | // Update the gamepad to press button 14 for scrolling. 112 | inputMapper.applier.change("buttons.14", 1); 113 | 114 | jqUnit.stop(); 115 | 116 | // Wait for a few milliseconds for the webpage to scroll. 117 | setTimeout(function () { 118 | jqUnit.start(); 119 | 120 | // Check if the gamepad has scrolled towards the left. 121 | var hasScrolledLeft = window.scrollX < 400; 122 | jqUnit.assertTrue("The page should have scrolled left.", hasScrolledLeft); 123 | }, gamepad.tests.delayMs); 124 | }); 125 | }); 126 | })(fluid, jQuery); 127 | -------------------------------------------------------------------------------- /tests/js/polling/gamepad-polling-tests.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2023 The Gamepad Navigator Authors 3 | See the AUTHORS.md file at the top-level directory of this distribution and at 4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md. 5 | 6 | Licensed under the BSD 3-Clause License. You may not use this file except in 7 | compliance with this License. 8 | 9 | You may obtain a copy of the BSD 3-Clause License at 10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE 11 | */ 12 | /* global jqUnit */ 13 | (function (fluid) { 14 | "use strict"; 15 | var gamepad = fluid.registerNamespace("gamepad"); 16 | 17 | fluid.defaults("gamepad.test.repeatRate.navigator", { 18 | gradeNames: ["gamepad.navigator"] 19 | }); 20 | 21 | var navigator; 22 | var windowMock; 23 | jqUnit.module("Gamepad Navigator Gamepad Polling Tests", { 24 | setup: function () { 25 | windowMock = gamepad.test.window(); 26 | navigator = gamepad.test.repeatRate.navigator({ 27 | windowObject: windowMock 28 | }); 29 | } 30 | }); 31 | 32 | jqUnit.test("Polling should not occur when no gamepads are connected.", function () { 33 | var initialValue = fluid.get(navigator, "model.buttons.0") || 0; 34 | jqUnit.assertEquals("No button value should have been recorded on startup.", 0, initialValue); 35 | 36 | // Create the enclosing gamepad definition, but flag it as disconnected. 37 | windowMock.applier.change("gamepads.0", { disconnected: true }); 38 | // Now simulate a button press. 39 | windowMock.applier.change("gamepads.0.buttons.0", 1); 40 | 41 | jqUnit.stop(); 42 | setTimeout(function () { 43 | jqUnit.start(); 44 | 45 | var updatedValue = fluid.get(navigator, "model.buttons.0") || 0; 46 | 47 | jqUnit.assertEquals("There should still be no button value after several polling cycles have elapsed.", 0, updatedValue); 48 | }, (navigator.model.prefs.pollingFrequency * 2)); 49 | }); 50 | 51 | jqUnit.test("Polling should start when a gamepad is connected.", function () { 52 | var initialValue = fluid.get(navigator, "model.buttons.0") || 0; 53 | jqUnit.assertEquals("No button value should have been recorded on startup.", 0, initialValue); 54 | 55 | // Simulate a button press. 56 | windowMock.applier.change("gamepads.0.buttons.0", 1); 57 | windowMock.events.gamepadconnected.fire(); 58 | 59 | jqUnit.stop(); 60 | setTimeout(function () { 61 | jqUnit.start(); 62 | 63 | var updatedValue = fluid.get(navigator, "model.buttons.0") || 0; 64 | 65 | jqUnit.assertEquals("There should be a button value after several polling cycles have elapsed.", 1, updatedValue); 66 | }, (navigator.model.prefs.pollingFrequency * 2)); 67 | }); 68 | 69 | jqUnit.test("Polling should continue if only some gamepads are disconnected.", function () { 70 | var initialValue = fluid.get(navigator, "model.buttons.0") || 0; 71 | jqUnit.assertEquals("No button value should have been recorded on startup.", 0, initialValue); 72 | 73 | // Create a connected gamepad and simulate a button press. 74 | windowMock.applier.change("gamepads.0.buttons.0", 1); 75 | windowMock.events.gamepadconnected.fire(); 76 | 77 | windowMock.applier.change("gamepads.1.buttons.1", 1); 78 | windowMock.applier.change("gamepads.1.disconnected", true); 79 | 80 | windowMock.events.gamepaddisconnected.fire(); 81 | 82 | jqUnit.stop(); 83 | setTimeout(function () { 84 | jqUnit.start(); 85 | 86 | var updatedValue = fluid.get(navigator, "model.buttons.0") || 0; 87 | 88 | jqUnit.assertEquals("There should be a button value after several polling cycles have elapsed.", 1, updatedValue); 89 | }, (navigator.model.prefs.pollingFrequency * 2)); 90 | }); 91 | 92 | 93 | jqUnit.test("Polling should stop when the last gamepad is disconnected.", function () { 94 | var timeToWait = (navigator.model.prefs.pollingFrequency * 2); 95 | var initialValue = fluid.get(navigator, "model.buttons.0") || 0; 96 | jqUnit.assertEquals("No button value should have been recorded on startup.", 0, initialValue); 97 | 98 | // Create a connected gamepad and simulate a button press. 99 | windowMock.applier.change("gamepads.0.buttons.0", 1); 100 | windowMock.events.gamepadconnected.fire(); 101 | 102 | jqUnit.stop(); 103 | setTimeout(function () { 104 | jqUnit.start(); 105 | 106 | var updatedValue = fluid.get(navigator, "model.buttons.0") || 0; 107 | 108 | jqUnit.assertEquals("There should be a button value after several polling cycles have elapsed.", 1, updatedValue); 109 | 110 | windowMock.applier.change("gamepads.0.disconnected", true); 111 | windowMock.events.gamepaddisconnected.fire(); 112 | 113 | jqUnit.stop(); 114 | 115 | setTimeout(function () { 116 | jqUnit.start(); 117 | var valueAfterDisconnect = fluid.get(navigator, "model.buttons.0") || 0; 118 | 119 | jqUnit.assertEquals("The button value should have been cleared after controller disconnect.", 0, valueAfterDisconnect); 120 | }, timeToWait); 121 | }, timeToWait); 122 | }); 123 | })(fluid); 124 | -------------------------------------------------------------------------------- /tests/js/tab/tab-button-discrete-tests.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2023 The Gamepad Navigator Authors 3 | See the AUTHORS.md file at the top-level directory of this distribution and at 4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md. 5 | 6 | Licensed under the BSD 3-Clause License. You may not use this file except in 7 | compliance with this License. 8 | 9 | You may obtain a copy of the BSD 3-Clause License at 10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE 11 | */ 12 | 13 | /* global gamepad, jqUnit */ 14 | 15 | (function (fluid, $) { 16 | "use strict"; 17 | 18 | $(document).ready(function () { 19 | 20 | fluid.registerNamespace("gamepad.tests"); 21 | 22 | gamepad.tests.delayMs = 250; 23 | 24 | jqUnit.module("Gamepad Navigator Button (Discrete) Tab Navigation Tests"); 25 | 26 | jqUnit.test("Tab from the last element to the first in discrete forward tabbing using buttons.", function () { 27 | jqUnit.expect(1); 28 | 29 | // Set initial conditions i.e., focus on the last element. 30 | $("#last").focus(); 31 | 32 | var inputMapper = gamepad.tests.tab.inputMapper(); 33 | 34 | /** 35 | * Update the gamepad to press button 5 (right bumper) for forward tab 36 | * navigation. 37 | */ 38 | inputMapper.applier.change("buttons.5", 1); 39 | 40 | jqUnit.stop(); 41 | 42 | /** 43 | * Wait for a few milliseconds for the navigator to focus. 44 | * 45 | * This is a race condition as the tab navigation is asynchronous and uses 46 | * setInterval for continuous tabbing when button is pressed but not released. 47 | */ 48 | setTimeout(function () { 49 | jqUnit.start(); 50 | 51 | // Check if the first element is focused. 52 | jqUnit.assertEquals("The first element (with tabindex=1) should be focused.", document.querySelector("#first"), document.activeElement); 53 | }, gamepad.tests.delayMs); 54 | }); 55 | 56 | jqUnit.test("Tab from the first element to the last in discrete reverse tabbing using buttons.", function () { 57 | jqUnit.expect(1); 58 | 59 | // Set initial conditions i.e., focus on the first element. 60 | $("#first").focus(); 61 | 62 | var inputMapper = gamepad.tests.tab.inputMapper(); 63 | 64 | /** 65 | * Update the gamepad to press button 4 (left bumper) for reverse tab 66 | * navigation. 67 | */ 68 | inputMapper.applier.change("buttons.4", 1); 69 | 70 | jqUnit.stop(); 71 | 72 | /** 73 | * Wait for a few milliseconds for the navigator to focus. 74 | * 75 | * This is a race condition as the tab navigation is asynchronous and uses 76 | * setInterval for continuous tabbing when button is pressed but not released. 77 | */ 78 | setTimeout(function () { 79 | jqUnit.start(); 80 | 81 | // Check if the last element is focused. 82 | jqUnit.assertEquals("The last element should be focused.", document.querySelector("#last"), document.activeElement); 83 | }, gamepad.tests.delayMs); 84 | }); 85 | 86 | jqUnit.test("Change the focus to the next element in discrete forward tabbing using buttons.", function () { 87 | jqUnit.expect(1); 88 | 89 | // Set initial conditions i.e., focus on the first element. 90 | $("#first").focus(); 91 | 92 | var inputMapper = gamepad.tests.tab.inputMapper(); 93 | 94 | /** 95 | * Update the gamepad to press button 5 (right bumper) for forward tab 96 | * navigation. 97 | */ 98 | inputMapper.applier.change("buttons.5", 1); 99 | 100 | jqUnit.stop(); 101 | 102 | // Wait for a few milliseconds for the navigator to change focus. 103 | setTimeout(function () { 104 | jqUnit.start(); 105 | 106 | // Check if the focus has moved to the next element. 107 | jqUnit.assertEquals("The focus should have moved to the second element.", document.querySelector("#second"), document.activeElement); 108 | }, gamepad.tests.delayMs); 109 | }); 110 | 111 | jqUnit.test("Change the focus to the previous element in discrete reverse tabbing using buttons.", function () { 112 | jqUnit.expect(1); 113 | 114 | // Set initial conditions i.e., focus on some element in the middle. 115 | $("#fifth").focus(); 116 | 117 | var inputMapper = gamepad.tests.tab.inputMapper(); 118 | 119 | /** 120 | * Update the gamepad to press button 4 (right bumper) for reverse tab 121 | * navigation. 122 | */ 123 | inputMapper.applier.change("buttons.4", 1); 124 | 125 | jqUnit.stop(); 126 | 127 | // Wait for a few milliseconds for the navigator to change focus. 128 | setTimeout(function () { 129 | jqUnit.start(); 130 | 131 | // Check if the focus has moved to the previous element. 132 | jqUnit.assertEquals("The focus should have moved to the fourth element.", document.querySelector("#fourth"), document.activeElement); 133 | }, gamepad.tests.delayMs); 134 | }); 135 | }); 136 | })(fluid, jQuery); 137 | -------------------------------------------------------------------------------- /src/js/settings/addBinding.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2023 The Gamepad Navigator Authors 3 | See the AUTHORS.md file at the top-level directory of this distribution and at 4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md. 5 | 6 | Licensed under the BSD 3-Clause License. You may not use this file except in 7 | compliance with this License. 8 | 9 | You may obtain a copy of the BSD 3-Clause License at 10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE 11 | */ 12 | (function (fluid) { 13 | "use strict"; 14 | var gamepad = fluid.registerNamespace("gamepad"); 15 | 16 | fluid.defaults("gamepad.settings.ui.addBinding.selectWithNone", { 17 | gradeNames: ["gamepad.ui.select"], 18 | model: { 19 | noneOption: true, 20 | noneDescription: "Select an option" 21 | } 22 | }); 23 | 24 | fluid.defaults("gamepad.settings.ui.addBinding", { 25 | gradeNames: ["gamepad.templateRenderer"], 26 | injectionType: "replaceWith", 27 | markup: { 28 | container: "\nWhen the \nis pressed,\n\n\n
"
29 | },
30 | model: {
31 | hidden: false,
32 |
33 | action: "none",
34 | actionChoices: {},
35 |
36 | index: "none",
37 | availableIndexChoices: {},
38 |
39 | missingParams: true
40 | },
41 | modelListeners: {
42 | hidden: {
43 | this: "{that}.container",
44 | method: "toggleClass",
45 | args: ["hidden", "{change}.value"]
46 | },
47 | availableIndexChoices: {
48 | funcName: "gamepad.settings.ui.addBinding.checkIndexChoices",
49 | args: ["{that}"]
50 | },
51 | action: {
52 | funcName: "gamepad.settings.ui.addBinding.checkForMissingParams",
53 | args: ["{that}"]
54 | },
55 | index: {
56 | funcName: "gamepad.settings.ui.addBinding.checkForMissingParams",
57 | args: ["{that}"]
58 | }
59 | },
60 | modelRelay: {
61 | source: "{that}.model.missingParams",
62 | target: "{that}.model.dom.addButton.attr.disabled"
63 | },
64 | selectors: {
65 | actionSelect: ".gamepad-settings-add-binding-action-select",
66 | indexSelect: ".gamepad-settings-add-binding-index-select",
67 | addButton: ".gamepad-settings-add-binding-addButton"
68 | },
69 | // TODO: These throw errors about length, whether here or in the subcomponent definition in the parent. Fix.
70 | invokers: {
71 | handleClick: {
72 | funcName: "gamepad.settings.ui.addBinding.notifyParent",
73 | args: ["{that}", "{arguments}.0", "{gamepad.settings.ui.bindingsPanel}"] // event, parentComponent
74 | }
75 | },
76 | listeners: {
77 | "onCreate.bindAddButton": {
78 | this: "{that}.dom.addButton",
79 | method: "click",
80 | args: ["{that}.handleClick"]
81 | }
82 | },
83 | components: {
84 | indexSelect: {
85 | container: "{that}.dom.indexSelect",
86 | type: "gamepad.settings.ui.addBinding.selectWithNone",
87 | options: {
88 | model: {
89 | noneDescription: "- select an input -",
90 | selectedChoice: "{gamepad.settings.ui.addBinding}.model.index",
91 | // Unlike the bindings, we can use availableIndexChoices directly.
92 | choices: "{gamepad.settings.ui.bindingsPanel}.model.availableIndexChoices"
93 | }
94 | }
95 | },
96 | actionSelect: {
97 | container: "{that}.dom.actionSelect",
98 | type: "gamepad.settings.ui.addBinding.selectWithNone",
99 | options: {
100 | model: {
101 | noneDescription: "- select an action -",
102 | selectedChoice: "{gamepad.settings.ui.addBinding}.model.action",
103 | choices: "{gamepad.settings.ui.addBinding}.model.actionChoices"
104 | }
105 | }
106 | }
107 | }
108 | });
109 |
110 | gamepad.settings.ui.addBinding.checkForMissingParams = function (that) {
111 | var missingParams = !that.model.index || that.model.index === "none" || !that.model.action || that.model.action === "none";
112 | that.applier.change("missingParams", missingParams);
113 | };
114 |
115 | gamepad.settings.ui.addBinding.notifyParent = function (that, event, parentComponent) {
116 | event.preventDefault();
117 |
118 | parentComponent.addBinding(that.model);
119 |
120 | that.applier.change("action", false);
121 | that.applier.change("index", false);
122 | };
123 |
124 | gamepad.settings.ui.addBinding.checkIndexChoices = function (that) {
125 | var hasAvailableIndexChoices = typeof that.model.availableIndexChoices === "object" && Object.keys(that.model.availableIndexChoices).length > 0;
126 | that.applier.change("hidden", !hasAvailableIndexChoices);
127 | };
128 | })(fluid);
129 |
--------------------------------------------------------------------------------
/tests/js/polling/action-repeat-tests.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 | /* global jqUnit */
13 | (function (fluid) {
14 | "use strict";
15 | var gamepad = fluid.registerNamespace("gamepad");
16 |
17 | jqUnit.module("Gamepad Navigator Repeat Rate Tests");
18 |
19 | // Test instance of mapper with a non-repeating action bound to
20 | // button/axes 0, and a repeating action bound to button/axes 1.
21 | fluid.defaults("gamepad.test.repeatRate.inputMapper", {
22 | gradeNames: ["gamepad.inputMapper.base"],
23 | windowObject: window,
24 | model: {
25 | count: 0,
26 | bindings: {
27 | axes: { 0: { action: "count" }, 1: { action: "count", repeatRate: 0.3 }},
28 | buttons: { 0: { action: "count" }, 1: { action: "count", repeatRate: 0.3 }}
29 | }
30 | },
31 | invokers: {
32 | "count": {
33 | funcName: "gamepad.test.repeatRate.inputMapper.updateCount",
34 | args: ["{that}"]
35 | }
36 | }
37 | });
38 |
39 | gamepad.test.repeatRate.inputMapper.updateCount = function (that) {
40 | var currentCount = that.model.count || 0;
41 | that.applier.change("count", currentCount + 1);
42 | };
43 |
44 | fluid.each(["axes", "buttons"], function (inputType) {
45 | jqUnit.test("Non-repeating actions bound to " + inputType + " should not repeat.", function () {
46 | var inputMapper = gamepad.test.repeatRate.inputMapper();
47 |
48 | jqUnit.assertEquals("No actions should have been executed on startup.", 0, inputMapper.model.count);
49 |
50 | inputMapper.applier.change([inputType, 0], 1);
51 |
52 | jqUnit.assertEquals("The initial " + inputType + " press should have fired an action.", 1, inputMapper.model.count);
53 |
54 | jqUnit.stop();
55 |
56 | setTimeout(function () {
57 | jqUnit.start();
58 |
59 | jqUnit.assertEquals("The action should not have been fired again.", 1, inputMapper.model.count);
60 | }, 500);
61 | });
62 | });
63 |
64 | fluid.each(["axes", "buttons"], function (inputType) {
65 | jqUnit.test("Repeating " + inputType + " actions should repeat.", function () {
66 | var inputMapper = gamepad.test.repeatRate.inputMapper();
67 |
68 | jqUnit.assertEquals("No actions should have been executed on startup.", 0, inputMapper.model.count);
69 |
70 | inputMapper.applier.change([inputType, 1], 1);
71 |
72 | jqUnit.assertEquals("The initial " + inputType + " press should have fired an action.", 1, inputMapper.model.count);
73 |
74 | jqUnit.stop();
75 |
76 | setTimeout(function () {
77 | jqUnit.start();
78 |
79 | jqUnit.assertEquals("The action should have been fired again.", 2, inputMapper.model.count);
80 | }, 500);
81 | });
82 | });
83 |
84 |
85 | fluid.each(["axes", "buttons"], function (inputType) {
86 | jqUnit.test("Analog " + inputType + " should work properly with non-repeating actions.", function () {
87 | var inputMapper = gamepad.test.repeatRate.inputMapper();
88 |
89 | jqUnit.assertEquals("No actions should have been executed on startup.", 0, inputMapper.model.count);
90 |
91 | inputMapper.applier.change([inputType, 0], 1);
92 |
93 | jqUnit.assertEquals("The initial " + inputType + " press should have fired an action.", 1, inputMapper.model.count);
94 |
95 | inputMapper.applier.change([inputType, 0], 0.75);
96 |
97 | jqUnit.assertEquals("A different " + inputType + " value above the threshold should not fire an action.", 1, inputMapper.model.count);
98 |
99 | jqUnit.stop();
100 |
101 | setTimeout(function () {
102 | jqUnit.start();
103 |
104 | jqUnit.assertEquals("The action should not have repeated.", 1, inputMapper.model.count);
105 | }, 500);
106 | });
107 | });
108 |
109 | fluid.each(["axes", "buttons"], function (inputType) {
110 | jqUnit.test("Analog " + inputType + " should work properly with repeating actions.", function () {
111 | var inputMapper = gamepad.test.repeatRate.inputMapper();
112 |
113 | jqUnit.assertEquals("No actions should have been executed on startup.", 0, inputMapper.model.count);
114 |
115 | inputMapper.applier.change([inputType, 1], 1);
116 |
117 | jqUnit.assertEquals("The initial input should have fired an action.", 1, inputMapper.model.count);
118 |
119 | inputMapper.applier.change([inputType, 1], 0.75);
120 |
121 | jqUnit.assertEquals("A different analog value above the threshold should not fire an action.", 1, inputMapper.model.count);
122 |
123 | jqUnit.stop();
124 |
125 | setTimeout(function () {
126 | jqUnit.start();
127 |
128 | jqUnit.assertEquals("The action should eventually have been repeated.", 2, inputMapper.model.count);
129 | }, 500);
130 | });
131 | });
132 | })(fluid);
133 |
--------------------------------------------------------------------------------
/src/js/content_scripts/modalManager.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 |
13 | (function (fluid) {
14 | "use strict";
15 |
16 | var gamepad = fluid.registerNamespace("gamepad");
17 |
18 |
19 | fluid.defaults("gamepad.modalManager", {
20 | gradeNames: ["gamepad.shadowHolder"],
21 | markup: {
22 | container: ""
23 | },
24 | model: {
25 | activeModal: false,
26 | fullscreen: false,
27 | lastExternalFocused: false,
28 | inputValue: "",
29 | inputType: ""
30 | },
31 | components: {
32 | actionLauncher: {
33 | container: "{that}.model.shadowElement",
34 | type: "gamepad.actionLauncher",
35 | createOnEvent: "onShadowReady",
36 | options: {
37 | model: {
38 | hidden: "{gamepad.modalManager}.model.hideActionLauncher",
39 | prefs: "{gamepad.modalManager}.model.prefs"
40 | }
41 | }
42 | },
43 | onscreenKeyboard: {
44 | container: "{that}.model.shadowElement",
45 | type: "gamepad.osk.modal",
46 | createOnEvent: "onShadowReady",
47 | options: {
48 | model: {
49 | hidden: "{gamepad.modalManager}.model.hideOnscreenKeyboard",
50 | prefs: "{gamepad.modalManager}.model.prefs",
51 | lastExternalFocused: "{gamepad.modalManager}.model.lastExternalFocused",
52 | inputValue: "{gamepad.modalManager}.model.inputValue"
53 | }
54 | }
55 | },
56 | onscreenNumpad: {
57 | container: "{that}.model.shadowElement",
58 | type: "gamepad.numpad.modal",
59 | createOnEvent: "onShadowReady",
60 | options: {
61 | model: {
62 | hidden: "{gamepad.modalManager}.model.hideOnscreenNumpad",
63 | prefs: "{gamepad.modalManager}.model.prefs",
64 | inputValue: "{gamepad.modalManager}.model.inputValue"
65 | }
66 | }
67 | },
68 | searchKeyboard: {
69 | container: "{that}.model.shadowElement",
70 | type: "gamepad.searchKeyboard.modal",
71 | createOnEvent: "onShadowReady",
72 | options: {
73 | model: {
74 | hidden: "{gamepad.modalManager}.model.hideSearchKeyboard",
75 | prefs: "{gamepad.modalManager}.model.prefs"
76 | }
77 | }
78 | },
79 | selectOperator: {
80 | container: "{that}.model.shadowElement",
81 | type: "gamepad.selectOperator",
82 | createOnEvent: "onShadowReady",
83 | options: {
84 | model: {
85 | hidden: "{gamepad.modalManager}.model.hideSelectOperator",
86 | prefs: "{gamepad.modalManager}.model.prefs",
87 | selectElement: "{gamepad.modalManager}.model.selectElement"
88 | }
89 | }
90 | }
91 | },
92 | modelListeners: {
93 | activeModal: {
94 | excludeSource: "init",
95 | funcName: "gamepad.modalManager.toggleModals",
96 | args: ["{that}"]
97 | },
98 | fullscreen: {
99 | excludeSource: "init",
100 | funcName: "gamepad.modalManager.reattachToDOM",
101 | args: ["{that}"]
102 | }
103 | }
104 | });
105 |
106 | gamepad.modalManager.reattachToDOM = function (that) {
107 | that.applier.change("activeModal", false);
108 |
109 | var toAttach = document.fullscreenElement || document.body;
110 | toAttach.appendChild(that.container[0]);
111 | };
112 |
113 | gamepad.modalManager.toggleModals = function (that) {
114 | var transaction = that.applier.initiate();
115 | var hideActionLauncher = that.model.activeModal !== "actionLauncher";
116 | transaction.fireChangeRequest({ path: "hideActionLauncher", value: hideActionLauncher });
117 |
118 | var hideOnscreenKeyboard = that.model.activeModal !== "onscreenKeyboard";
119 | transaction.fireChangeRequest({ path: "hideOnscreenKeyboard", value: hideOnscreenKeyboard });
120 |
121 | var hideSearchKeyboard = that.model.activeModal !== "searchKeyboard";
122 | transaction.fireChangeRequest({ path: "hideSearchKeyboard", value: hideSearchKeyboard });
123 |
124 | var hideSelectOperator = that.model.activeModal !== "selectOperator";
125 | transaction.fireChangeRequest({ path: "hideSelectOperator", value: hideSelectOperator });
126 |
127 | var hideOnscreenNumpad = that.model.activeModal !== "onscreenNumpad";
128 | transaction.fireChangeRequest({ path: "hideOnscreenNumpad", value: hideOnscreenNumpad});
129 |
130 | transaction.commit();
131 | };
132 | })(fluid);
133 |
--------------------------------------------------------------------------------
/src/js/content_scripts/select-operator.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 | (function (fluid) {
13 | "use strict";
14 | var gamepad = fluid.registerNamespace("gamepad");
15 |
16 | fluid.defaults("gamepad.selectOperator", {
17 | gradeNames: ["gamepad.modal"],
18 | model: {
19 | classNames: " selectOperator-modal",
20 | closeButtonLabel: "Cancel",
21 | label: "Gamepad Navigator: Select Option",
22 | selectElement: false,
23 | items: {}
24 | },
25 |
26 | modelListeners: {
27 | selectElement: {
28 | funcName: "gamepad.selectOperator.generateItemsFromSelect",
29 | args: ["{that}"]
30 | }
31 | },
32 |
33 | invokers: {
34 | handleItemClick: {
35 | funcName: "gamepad.selectOperator.handleItemClick",
36 | args: ["{that}", "{arguments}.0", "{arguments}.1"] // nodeIndex, event
37 | }
38 | },
39 |
40 | components: {
41 | listSelector: {
42 | type: "gamepad.ui.listSelector",
43 | container: "{that}.dom.modalBody",
44 | options: {
45 | model: {
46 | description: "Select an option from the list below or hit "Cancel" to close this modal. Only selectable items are displayed.",
47 | items: "{gamepad.selectOperator}.model.items",
48 | prefs: "{gamepad.selectOperator}.model.prefs"
49 | },
50 | invokers: {
51 | handleItemClick: {
52 | func: "{gamepad.selectOperator}.handleItemClick",
53 | args: ["{arguments}.0", "{arguments}.1"] // nodeIndex, event
54 | }
55 | }
56 | }
57 | }
58 | }
59 | });
60 |
61 | gamepad.selectOperator.generateItemsFromSelect = function (that) {
62 | var selectElement = fluid.get(that.model, "selectElement");
63 |
64 | if (selectElement) {
65 | var generatedItems = {};
66 |
67 | for (var nodeIndex = 0; nodeIndex < selectElement.children.length; nodeIndex++) {
68 | var childNode = selectElement.children.item(nodeIndex);
69 | var isHidden = childNode.getAttribute("hidden") !== null ? true : false;
70 | var isDisabled = childNode.getAttribute("disabled") !== null ? true : false;
71 | var isSelected = childNode.getAttribute("selected") !== null ? true : false;
72 |
73 | if (childNode.nodeName === "OPTION" && !isHidden && !isDisabled) {
74 | generatedItems[nodeIndex] = {
75 | description: childNode.textContent,
76 | selected: isSelected
77 | };
78 | }
79 | }
80 |
81 | var transaction = that.applier.initiate();
82 | transaction.fireChangeRequest({ path: "items", type: "DELETE" });
83 | transaction.fireChangeRequest({ path: "items", value: generatedItems });
84 | transaction.commit();
85 | }
86 | };
87 |
88 | gamepad.selectOperator.handleItemClick = function (that, nodeIndexString, event) {
89 | var nodeIndex = parseInt(nodeIndexString);
90 |
91 | var selectElement = fluid.get(that, "model.selectElement");
92 | if (selectElement) {
93 | if (selectElement.multiple) {
94 | // Toggle the clicked option without affecting any other selected values.
95 | var clickedOptionElement = selectElement.children[nodeIndex];
96 | if (clickedOptionElement.selected) {
97 | clickedOptionElement.removeAttribute("selected");
98 | }
99 | else {
100 | clickedOptionElement.setAttribute("selected", "");
101 | }
102 | }
103 | else {
104 | for (var optionIndex = 0; optionIndex < selectElement.children.length; optionIndex++) {
105 | var optionElement = selectElement.children[optionIndex];
106 | // Only select the option that was clicked.
107 | if (optionIndex === nodeIndex) {
108 | var optionValue = optionElement.value;
109 |
110 | // Just setting the value doesn't property trigger a change.
111 | $(selectElement).val(optionValue);
112 |
113 | optionElement.setAttribute("selected", "");
114 | }
115 | // Clear the selected attribute for the rest.
116 | else {
117 | optionElement.removeAttribute("selected");
118 | }
119 | }
120 | }
121 | selectElement.dispatchEvent(new Event("change"));
122 | }
123 |
124 | var transaction = that.applier.initiate();
125 | transaction.fireChangeRequest({ path: "items", type: "DELETE" });
126 | transaction.fireChangeRequest({ path: "items", value: {} });
127 | transaction.fireChangeRequest({ path: "selectElement", value: false });
128 | transaction.commit();
129 |
130 | that.closeModal(event);
131 | selectElement.focus();
132 | };
133 | })(fluid);
134 |
--------------------------------------------------------------------------------
/src/js/content_scripts/focus-overlay.js:
--------------------------------------------------------------------------------
1 | (function (fluid) {
2 | "use strict";
3 |
4 | var gamepad = fluid.registerNamespace("gamepad");
5 |
6 | fluid.defaults("gamepad.focusOverlay.pointer", {
7 | gradeNames: ["gamepad.templateRenderer"],
8 | markup: {
9 | container: ""
10 | },
11 | listeners: {
12 | "onCreate.listenForWindowFocusEvents": {
13 | funcName: "gamepad.focusOverlay.pointer.listenForWindowFocusEvents",
14 | args: ["{that}"]
15 | }
16 | },
17 | invokers: {
18 | handleFocusin: {
19 | funcName: "gamepad.focusOverlay.pointer.handleFocusin",
20 | args: ["{that}", "{arguments}.0"] // event
21 | }
22 | },
23 | modelListeners: {
24 | modalManagerShadowElement: {
25 | funcName: "gamepad.focusOverlay.pointer.listenForModalFocusEvents",
26 | args: ["{that}"]
27 | }
28 | }
29 | });
30 |
31 | gamepad.focusOverlay.pointer.listenForWindowFocusEvents = function (that) {
32 | window.addEventListener("focusin", that.handleFocusin);
33 | };
34 |
35 | gamepad.focusOverlay.pointer.listenForModalFocusEvents = function (that) {
36 | var modalManagerShadowElement = fluid.get(that, "model.modalManagerShadowElement");
37 | if (modalManagerShadowElement) {
38 | modalManagerShadowElement.addEventListener("focusin", that.handleFocusin);
39 | }
40 | };
41 |
42 | gamepad.focusOverlay.pointer.handleFocusin = function (that) {
43 | var containerDomElement = that.container[0];
44 |
45 | var activeElement = fluid.get(that.model, "modalManagerShadowElement.activeElement") || document.activeElement;
46 |
47 | var clientRect = activeElement.getBoundingClientRect();
48 |
49 | // Our outline is three pixels, so we adjust everything accordingly.
50 | containerDomElement.style.left = (clientRect.x + window.scrollX - 3) + "px";
51 | containerDomElement.style.top = (clientRect.y + window.scrollY - 3) + "px";
52 | containerDomElement.style.height = (clientRect.height) + "px";
53 | containerDomElement.style.width = (clientRect.width) + "px";
54 |
55 | var elementStyles = getComputedStyle(activeElement);
56 | var borderRadiusValue = elementStyles.getPropertyValue("border-radius");
57 | if (borderRadiusValue.length) {
58 | containerDomElement.style.borderRadius = borderRadiusValue;
59 | }
60 | else {
61 | containerDomElement.style.borderRadius = 0;
62 | }
63 | };
64 |
65 | fluid.defaults("gamepad.focusOverlay", {
66 | gradeNames: ["gamepad.shadowHolder"],
67 | markup: {
68 | container: ""
69 | },
70 | model: {
71 | shadowElement: false,
72 |
73 | modalManagerShadowElement: false,
74 |
75 | prefs: {},
76 | hideFocusOverlay: true
77 | },
78 | modelRelay: {
79 | hideFocusOverlay: {
80 | source: "{that}.model.hideFocusOverlay",
81 | target: "{that}.model.dom.container.attr.hidden"
82 | }
83 | },
84 | components: {
85 | pointer: {
86 | container: "{that}.model.shadowElement",
87 | type: "gamepad.focusOverlay.pointer",
88 | createOnEvent: "onShadowReady",
89 | options: {
90 | model: {
91 | modalManagerShadowElement: "{gamepad.focusOverlay}.model.modalManagerShadowElement"
92 | }
93 | }
94 | }
95 | },
96 | modelListeners: {
97 | prefs: {
98 | excludeSource: "init",
99 | funcName: "gamepad.focusOverlay.shouldDisplayOverlay",
100 | args: ["{that}"]
101 | },
102 | modalManagerShadowElement: {
103 | funcName: "gamepad.focusOverlay.listenForModalFocusEvents",
104 | args: ["{that}"]
105 | }
106 | },
107 | listeners: {
108 | "onCreate.listenForWindowFocusEvents": {
109 | funcName: "gamepad.focusOverlay.listenForWindowFocusEvents",
110 | args: ["{that}"]
111 | }
112 | },
113 | invokers: {
114 | shouldDisplayOverlay: {
115 | funcName: "gamepad.focusOverlay.shouldDisplayOverlay",
116 | args: ["{that}", "{arguments}.0"] // event
117 | }
118 | }
119 | });
120 |
121 | gamepad.focusOverlay.shouldDisplayOverlay = function (that) {
122 | var activeElement = fluid.get(that.model, "modalManagerShadowElement.activeElement") || document.activeElement;
123 | var fixFocus = fluid.get(that, "model.prefs.fixFocus") ? true : false;
124 | var hideFocusOverlay = !fixFocus || !activeElement;
125 | that.applier.change("hideFocusOverlay", hideFocusOverlay);
126 | };
127 |
128 | gamepad.focusOverlay.listenForWindowFocusEvents = function (that) {
129 | window.addEventListener("focusin", that.shouldDisplayOverlay);
130 | window.addEventListener("focusout", that.shouldDisplayOverlay);
131 | };
132 |
133 | gamepad.focusOverlay.listenForModalFocusEvents = function (that) {
134 | var modalManagerShadowElement = fluid.get(that, "model.modalManagerShadowElement");
135 | if (modalManagerShadowElement) {
136 | modalManagerShadowElement.addEventListener("focusin", that.shouldDisplayOverlay);
137 | modalManagerShadowElement.addEventListener("focusout", that.shouldDisplayOverlay);
138 | }
139 | };
140 | })(fluid);
141 |
--------------------------------------------------------------------------------
/src/images/button.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
114 |
--------------------------------------------------------------------------------
/tests/js/arrows/arrows-tests.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 |
13 | /* global gamepad, jqUnit */
14 |
15 | (function (fluid, $) {
16 | "use strict";
17 |
18 | $(document).ready(function () {
19 |
20 | fluid.registerNamespace("gamepad.tests");
21 |
22 | var counter;
23 | jqUnit.module("Gamepad Navigator Arrow Tests", {
24 | setup: function () {
25 | counter = gamepad.tests.utils.arrows.counter("body");
26 | },
27 | teardown: function () {
28 | counter.destroy();
29 | }
30 | });
31 |
32 | var arrowButtons = {
33 | 12: "ArrowUp",
34 | 13: "ArrowDown",
35 | 14: "ArrowLeft",
36 | 15: "ArrowRight"
37 | };
38 |
39 | fluid.each(arrowButtons, function (keyCode, button) {
40 | jqUnit.test("Arrow button tests: " + keyCode, function () {
41 | counter.focus();
42 | var inputMapper = gamepad.tests.arrows.buttonInputMapper();
43 |
44 | var initialKeydownValue = fluid.get(counter, ["model", "eventCount", "keydown", keyCode ]);
45 | jqUnit.assertUndefined("There should be no initial keydown counter value for " + keyCode, initialKeydownValue);
46 |
47 | var initialKeyupValue = fluid.get(counter, ["model", "eventCount", "keyup", keyCode ]);
48 | jqUnit.assertUndefined("There should be no initial keyup counter value for " + keyCode, initialKeyupValue);
49 |
50 | inputMapper.applier.change(["buttons", button], 1);
51 |
52 | var updatedKeydownValue = fluid.get(counter, ["model", "eventCount", "keydown", keyCode ]);
53 | jqUnit.assertEquals("The keydown counter value should have been updated for " + keyCode, 1, updatedKeydownValue);
54 |
55 | var updatedKeyupValue = fluid.get(counter, ["model", "eventCount", "keyup", keyCode ]);
56 | jqUnit.assertEquals("The keydown counter value should have been updated for " + keyCode, 1, updatedKeyupValue);
57 | });
58 | });
59 |
60 | var axisTestDefs = {
61 | "Horizontal Axis": {
62 | invert: false,
63 | axis: 0,
64 | negativeKey: "ArrowLeft",
65 | positiveKey: "ArrowRight"
66 | },
67 | "Inverted Horizontal Axis": {
68 | invert: true,
69 | axis: 0,
70 | negativeKey: "ArrowRight",
71 | positiveKey: "ArrowLeft"
72 | },
73 | "Vertical Axis": {
74 | invert: false,
75 | axis: 1,
76 | negativeKey: "ArrowUp",
77 | positiveKey: "ArrowDown"
78 | },
79 | "Inverted Vertical Axis": {
80 | invert: true,
81 | axis: 1,
82 | negativeKey: "ArrowDown",
83 | positiveKey: "ArrowUp"
84 | }
85 | };
86 |
87 | fluid.each(axisTestDefs, function (testDef, testDefKey) {
88 | jqUnit.test(testDefKey, function () {
89 | var negativeModelPath = ["model", "eventCount", "keydown", testDef.negativeKey];
90 | var positiveModelPath = ["model", "eventCount", "keydown", testDef.positiveKey];
91 |
92 | counter.focus();
93 | var inputMapper = gamepad.tests.axisInputMapper({
94 | invert: testDef.invert
95 | });
96 |
97 | var initialNegativeValue = fluid.get(counter, negativeModelPath);
98 | jqUnit.assertUndefined("There should be no initial keydown counter value for the negative side of the axis.", initialNegativeValue);
99 |
100 | var initialPositiveValue = fluid.get(counter, positiveModelPath);
101 | jqUnit.assertUndefined("There should be no initial keydown counter value for the positive side of the axis.", initialPositiveValue);
102 |
103 | inputMapper.applier.change(["axes", testDef.axis], -1);
104 |
105 | jqUnit.stop();
106 | setTimeout(function () {
107 | jqUnit.start();
108 | var secondNegativeValue = fluid.get(counter, negativeModelPath);
109 | jqUnit.assertEquals("An arrow should have been sent from the negative side of the axis.", 1, secondNegativeValue);
110 |
111 | var secondPositiveValue = fluid.get(counter, positiveModelPath);
112 | jqUnit.assertUndefined("An arrow should not have been sent from the positive side of the axis.", secondPositiveValue);
113 |
114 | inputMapper.applier.change(["axes", testDef.axis], 0);
115 | inputMapper.applier.change(["axes", testDef.axis], 1);
116 |
117 | jqUnit.stop();
118 | setTimeout(function () {
119 | jqUnit.start();
120 | var thirdNegativeValue = fluid.get(counter, negativeModelPath);
121 | jqUnit.assertEquals("No additional arrows should have been sent from the negative side of the axis.", 1, thirdNegativeValue);
122 |
123 | var finalPositiveValue = fluid.get(counter, positiveModelPath);
124 | jqUnit.assertEquals("An arrow should have been sent from the positive side of the axis.", 1, finalPositiveValue);
125 | }, 50);
126 | }, 50);
127 | });
128 | });
129 | });
130 | })(fluid, jQuery);
131 |
--------------------------------------------------------------------------------
/docs/PUBLISHING.md:
--------------------------------------------------------------------------------
1 |
12 |
13 | # Publishing to the Chrome Web Store
14 |
15 | 1. Prepare the code and the `master` branch.
16 | 1. Update the `version` number in the [manifest](src/manifest.json#L3) and [package](package.json#L3) files.
17 | 1. The project follows [semantic versioning](https://semver.org/), i.e. the version is in the format
18 | "{MAJOR.MINOR.PATCH}[-dev]". For example, "1.0.15" and "1.1.9-dev".
19 | 1. The `version` number in [manifest.json](src/manifest.json) file should be completely numeric. However, other
20 | json files (for example, [package.json](package.json)) may contain alphabets and non-numeric characters with
21 | the version number.
22 | (See [Manifest Version](https://developer.chrome.com/extensions/manifest/version) for more details)
23 | 2. If the release is a **dev release**, use one of the following commands.
24 | 1. For bug fixes with no API or functionality changes, update the PATCH version: `grunt updateVersion --patch`
25 | 2. For minor API changes and functionality updates, update the MINOR version: `grunt updateVersion --minor`
26 | 3. For breaking API changes and new functionalities, update the MAJOR version: `grunt updateVersion --major`
27 | 3. For a **standard release**, add the command-line flag `--standard` to the above commands.
28 | 1. Dev release with PATCH version updates: `grunt updateVersion --patch --standard`
29 | 2. Dev release with MINOR version updates: `grunt updateVersion --minor --standard`
30 | 3. Dev release with MAJOR version updates: `grunt updateVersion --major --standard`
31 | 4. For a transition from a **dev release** to a **standard release** without updating the version number, use the
32 | command: `grunt updateVersion --standard`
33 | 5. Push the changes to the `master` branch.
34 | 2. Ensure that all of the code that should be published has been merged into the `master` branch.
35 | 3. Ensure that the code in the `master` branch is working as expected.
36 | 1. Lint: `npm run lint`
37 | 2. Run tests: `npm test`
38 | 3. Manual test build.
39 | 1. Create a build and load the generated unpacked extension into Chrome.
40 | (Refer to the [Installation](../README.md#installation) section for more details)
41 | 2. Test all of the available configuration options (Action, Speed Factor, et cetera) and ensure that they work
42 | on the browser correctly.
43 | 1. Refresh any browser tabs/windows that were open before installing the extension.
44 | 2. The actions and the associated configuration options should be tested individually and in combination to
45 | ensure that they are working correctly. For example, testing ***Scroll Vertically*** separately, then
46 | changing its ***Speed Factor***, and selecting the ***Invert Action*** option.
47 | 3. Test the same action and the associated configuration options with at least one different button,
48 | thumbstick, and trigger.
49 | 4. Multiple web pages should be tested to ensure that everything works correctly.
50 |
51 | 2. Create the release package: `grunt archive`
52 | 1. This will generate a zip file with the name "build_{tag_name}.zip" (for example, build_v0.1.0-dev.zip), which
53 | will be uploaded to the [Chrome Web Store](https://chrome.google.com/webstore/category/extensions).
54 |
55 | 3. Publish to the [Chrome Web Store](https://chrome.google.com/webstore/category/extensions).
56 | 1. Go to the Developer Dashboard on the Chrome Web Store and log in.
57 | 2. On the Developer Dashboard, click "Edit" (located on the Gamepad Navigator's right-hand side).
58 | 3. On the Gamepad Navigator edit page, click "Upload updated package" and upload the zip created in step 2 above.
59 | 4. Update the "Detailed description" field as necessary. Similar information is contained in this README.
60 | 5. Update the screenshots and videos if necessary. For example, if the images, icons, or the UI of the configuration
61 | panel has been changed. They will need to be the exact size requested.
62 | 6. Click "Preview Changes".
63 | 1. Verify that everything appears correct. Pay particular attention to anything that was changed. For example,
64 | version number/name, description, screenshots, et cetera.
65 | 7. If everything appears correct, publish the changes.
66 | 1. The actual publishing to the Chrome Web Store will take some time and may need to go through a review process.
67 |
68 | 4. Verify the published Gamepad Navigator Chrome extension.
69 | 1. Ensure that the contents of the Gamepad Navigator on the Chrome Web Store appear correct. Double-check the
70 | details like version number/name, descriptions, screenshots, et cetera.
71 | 2. Install the updated extension from the Chrome Web Store, and run through the manual testing again. (See step
72 | 1.3.3 above)
73 | 3. If there are any issues, fix them and repeat the process.
74 |
75 | 5. Create a GitHub release.
76 | 1. Set up the `.gruntfile.env` file.
77 | 1. Generate your GitHub access token.
78 | (Refer to the [GitHub Docs](https://tinyurl.com/yxsbzjme) for more details)
79 | 2. Create a copy of the `.gruntfile.env.default` file at the root level and rename the copy as `.gruntfile.env`.
80 | 3. Open the `.gruntfile.env` file and set the value of the `GITHUB_ACCESS_TOKEN` variable as your GitHub token
81 | generated in the above step.
82 | 2. Create a release on GitHub: `grunt release`
83 | 1. This will prompt the user to enter various details (release title, tag version, description, et cetera) on
84 | their terminal, and will create a new release as per those details.
85 | 3. Once the release is created successfully, announce it where required (for example, the fluid-work mailing list).
86 |
--------------------------------------------------------------------------------
/src/js/content_scripts/list-selector.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright (c) 2023 The Gamepad Navigator Authors
3 | See the AUTHORS.md file at the top-level directory of this distribution and at
4 | https://github.com/fluid-lab/gamepad-navigator/raw/main/AUTHORS.md.
5 |
6 | Licensed under the BSD 3-Clause License. You may not use this file except in
7 | compliance with this License.
8 |
9 | You may obtain a copy of the BSD 3-Clause License at
10 | https://github.com/fluid-lab/gamepad-navigator/blob/main/LICENSE
11 | */
12 |
13 | (function (fluid) {
14 | "use strict";
15 | var gamepad = fluid.registerNamespace("gamepad");
16 |
17 | fluid.defaults("gamepad.ui.listSelector", {
18 | gradeNames: ["gamepad.templateRenderer"],
19 | markup: {
20 | container: "%description
%description
"
22 | },
23 | selectors: {
24 | items: ".gamepad-list-selector-items",
25 | activeItems: ".gamepad-list-selector-active-item"
26 | },
27 | model: {
28 | description: "",
29 | focusedItemIndex: 0,
30 | items: {}
31 | },
32 | invokers: {
33 | handleFocusChange: {
34 | funcName: "gamepad.ui.listSelector.handleFocusChange",
35 | args: ["{that}"]
36 | },
37 | // This will be added by grades that extend this one.
38 | handleItemClick: {
39 | funcName: "fluid.notImplemented"
40 | },
41 | handleKeydown: {
42 | funcName: "gamepad.ui.listSelector.handleKeydown",
43 | args: ["{that}", "{arguments}.0"] // event
44 | },
45 | renderItems: {
46 | funcName: "gamepad.ui.listSelector.renderItems",
47 | args: ["{that}", "{that}.dom.items", "{that}.model.items"] // itemContainer, items
48 | }
49 | },
50 | modelListeners: {
51 | items: {
52 | func: "{that}.renderItems"
53 | },
54 | focusedItemIndex: {
55 | excludeSource: "init",
56 | func: "{that}.handleFocusChange"
57 | }
58 | },
59 | listeners: {
60 | "onCreate.bindKeydown": {
61 | this: "{that}.container",
62 | method: "keydown",
63 | args: ["{that}.handleKeydown"]
64 | },
65 | "onCreate.renderItems": {
66 | func: "{that}.renderItems"
67 | }
68 | }
69 | });
70 |
71 | /**
72 | *
73 | * Render a list of items as focusable/clickable/keyboard operable elements.
74 | * @param {Object} that - The listSelector component.
75 | * @param {selectElement} enclosingElement - The select element to populate.
76 | * @param {Object.