Rim-Modules/gamepad-viewer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix joystick angle

Browse Source
This commit is contained in:
e7d 2024-03-11 12:42:32 +01:00
parent d97c4f07a0
commit 7657c70ba6
No known key found for this signature in database
GPG Key ID: F320BE007C0B8881
4 changed files with 13 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
js/gamepad.js
View File

@ -926,15 +926,13 @@ class Gamepad {
gamepad.axes.forEach((updatedAxis, index) => {
// get the axis information
const { $axis, attribute, axis } = this.mapping.axes[index];
if (!$axis) return;
if (!$axis || updatedAxis === axis) return;
// update the display value
if (updatedAxis !== axis) {
$axis.setAttribute(attribute.replace('-axis', '-value'), updatedAxis);
$axis.setAttribute(attribute.replace('-axis', '-value'), updatedAxis);
// ensure we have an axis updater callback and hook the template defined axis update method
if ('function' === typeof this.updateAxis) this.updateAxis($axis, attribute, updatedAxis);
}
// ensure we have an axis updater callback and hook the template defined axis update method
if ('function' === typeof this.updateAxis) this.updateAxis($axis, attribute, updatedAxis);
// save the updated button
this.mapping.axes[index].axis = updatedAxis;

6
templates/ds4/template.js
View File

@ -28,17 +28,17 @@ window.gamepad.TemplateClass = class DualShock4Template {
if (!$axis.matches('.stick')) return;
if (attribute === 'data-axis-x') {
$axis.style.setProperty('margin-left', `${axis * 25}px`);
this.rotateY = parseFloat(axis * 30, 8);
this.updateRotate($axis);
}
if (attribute === 'data-axis-y') {
$axis.style.setProperty('margin-top', `${axis * 25}px`);
this.rotateX = -parseFloat(axis * 30, 8);
this.updateRotate($axis);
}
}
updateRotate($axis) {
$axis.style.setProperty('transform', `rotateX(${this.rotateX}deg) rotateY(${this.rotateY}deg)`);
const rotateX = parseFloat($axis.getAttribute('data-value-y') * 30);
const rotateY = -parseFloat($axis.getAttribute('data-value-x') * 30);
$axis.style.setProperty('transform', `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`);
}
};

6
templates/dualsense/template.js
View File

@ -28,17 +28,17 @@ window.gamepad.TemplateClass = class DualSenseTemplate {
if (!$axis.matches('.stick')) return;
if (attribute === 'data-axis-x') {
$axis.style.setProperty('margin-left', `${axis * 25}px`);
this.rotateY = parseFloat(axis * 30, 8);
this.updateRotate($axis);
}
if (attribute === 'data-axis-y') {
$axis.style.setProperty('margin-top', `${axis * 25}px`);
this.rotateX = -parseFloat(axis * 30, 8);
this.updateRotate($axis);
}
}
updateRotate($axis) {
$axis.style.setProperty('transform', `rotateX(${this.rotateX}deg) rotateY(${this.rotateY}deg)`);
const rotateX = parseFloat($axis.getAttribute('data-value-y') * 30);
const rotateY = -parseFloat($axis.getAttribute('data-value-x') * 30);
$axis.style.setProperty('transform', `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`);
}
};

8
templates/xbox-one/template.js
View File

@ -6,8 +6,6 @@ window.gamepad.TemplateClass = class XboxOneTemplate {
this.gamepad = window.gamepad;
this.gamepad.updateButton = this.updateButton.bind(this);
this.gamepad.updateAxis = this.updateAxis.bind(this);
this.rotateX = 0;
this.rotateY = 0;
}
/**
@ -28,17 +26,17 @@ window.gamepad.TemplateClass = class XboxOneTemplate {
if (!$axis.matches('.stick')) return;
if (attribute === 'data-axis-x') {
$axis.style.setProperty('margin-left', `${axis * 25}px`);
this.rotateY = parseFloat(axis * 30, 8);
this.updateRotate($axis);
}
if (attribute === 'data-axis-y') {
$axis.style.setProperty('margin-top', `${axis * 25}px`);
this.rotateX = -parseFloat(axis * 30, 8);
this.updateRotate($axis);
}
}
updateRotate($axis) {
$axis.style.setProperty('transform', `rotateX(${this.rotateX}deg) rotateY(${this.rotateY}deg)`);
const rotateX = parseFloat($axis.getAttribute('data-value-y') * 30);
const rotateY = -parseFloat($axis.getAttribute('data-value-x') * 30);
$axis.style.setProperty('transform', `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`);
}
};