xxxxxxxxxx
60
let controllerIndex = null;
window.addEventListener("gamepadconnected", (event) => {
const gamepad = event.gamepad;
controllerIndex = gamepad.index;
console.log("connected");
});
window.addEventListener("gamepaddisconnected", (event) => {
controllerIndex = null;
console.log("disconnected");
});
function handleButtons(buttons) {
for (let i = 0; i < buttons.length; i++) {
const button = buttons[i];
const buttonElement = document.getElementById(`controller-b${i}`);
const selectedButtonClass = "selected-button";
if (buttonElement) {
if (button.value > 0) {
buttonElement.classList.add(selectedButtonClass);
buttonElement.style.filter = `contrast(${button.value * 150}%)`;
} else {
buttonElement.classList.remove(selectedButtonClass);
buttonElement.style.filter = `contrast(100%)`;
}
}
}
}
function updateStick(elementId, leftRightAxis, upDownAxis) {
const multiplier = 25;
const stickLeftRight = leftRightAxis * multiplier;
const stickUpDown = upDownAxis * multiplier;
//const stick = document.getElementById(elementId);
//const x = Number(stick.dataset.originalXPosition);
//const y = Number(stick.dataset.originalYPosition);
//stick.setAttribute("cx", x + stickLeftRight);
//stick.setAttribute("cy", y + stickUpDown);
}
function handleSticks(axes) {
updateStick("controller-b10", axes[0], axes[1]);
updateStick("controller-b11", axes[2], axes[3]);
}
function gameLoop() {
if (controllerIndex !== null) {
const gamepad = navigator.getGamepads()[controllerIndex];
handleButtons(gamepad.buttons);
handleSticks(gamepad.axes);
console.log(gamepad);
}
// requestAnimationFrame(gameLoop);
}
gameLoop();