nikrozman/air-mouse
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects 2 Releases Activity

Initial physical button mapping implementation #4

Browse Source
This commit is contained in:
Nik Rozman
2026-03-03 11:44:38 +01:00
parent dcc50150b8
commit 5c36aa041e
8 changed files with 321 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/app.js
+50 -3
View File
@@ -18,7 +18,8 @@ const FLAG_ALL_DEFAULT = FLAG_TAP_ENABLED | FLAG_TEMP_COMP_ENABLED | FLAG
// Local shadow of the current config (kept in sync with device)
const config = { sensitivity:600, deadZone:0.06, accelStrength:0.08, curve:0, axisFlip:0, chargeMode:1,
tapThreshold:12, tapAction:0, tapKey:0, tapMod:0, tapFreezeEnabled:1, jerkThreshold:2000,
featureFlags:FLAG_ALL_DEFAULT };
featureFlags:FLAG_ALL_DEFAULT,
btnLeftPin:0xFF, btnRightPin:0xFF, btnMiddlePin:0xFF };
let device=null, server=null, chars={}, userDisconnected=false;
let currentChargeStatus=0, currentBattPct=null, currentBattVoltage=null;
@@ -239,6 +240,13 @@ async function readConfigBlob() {
} else {
config.featureFlags = FLAG_ALL_DEFAULT; // old firmware — assume all on
}
if (view.byteLength >= 28) {
config.btnLeftPin = view.getUint8(25);
config.btnRightPin = view.getUint8(26);
config.btnMiddlePin = view.getUint8(27);
} else {
config.btnLeftPin = config.btnRightPin = config.btnMiddlePin = 0xFF; // disabled
}
applyConfigToUI();
log(`Config loaded — sens=${config.sensitivity.toFixed(0)} dz=${config.deadZone.toFixed(3)} tapThr=${config.tapThreshold}`,'ok');
} catch(e) { log(`Config read error: ${e.message}`,'err'); }
@@ -270,6 +278,37 @@ function applyConfigToUI() {
document.getElementById('capTapEnabled').checked = !!(config.featureFlags & FLAG_TAP_ENABLED);
document.getElementById('capTempComp').checked = !!(config.featureFlags & FLAG_TEMP_COMP_ENABLED);
document.getElementById('capAutoRecal').checked = !!(config.featureFlags & FLAG_AUTO_RECAL_ENABLED);
document.getElementById('btnLeftPin').value = config.btnLeftPin;
document.getElementById('btnRightPin').value = config.btnRightPin;
document.getElementById('btnMiddlePin').value = config.btnMiddlePin;
updatePinDiagram();
}
// ── XIAO pin diagram ──────────────────────────────────────────────────────────
function updatePinDiagram() {
const st = getComputedStyle(document.documentElement);
const COL_L = st.getPropertyValue('--ok').trim();
const COL_R = st.getPropertyValue('--accent2').trim();
const COL_M = st.getPropertyValue('--accent').trim();
const DEF_F = '#0c1828', DEF_S = '#162234';
for (let i = 0; i <= 10; i++) {
const el = document.getElementById(`xiaoPin${i}`);
if (el) { el.setAttribute('fill', DEF_F); el.setAttribute('stroke', DEF_S); }
}
const apply = (pin, col) => {
if (pin > 10) return;
const el = document.getElementById(`xiaoPin${pin}`);
if (el) { el.setAttribute('fill', col); el.setAttribute('stroke', col); }
};
const l = parseInt(document.getElementById('btnLeftPin').value, 10);
const r = parseInt(document.getElementById('btnRightPin').value, 10);
const m = parseInt(document.getElementById('btnMiddlePin').value, 10);
if (l <= 10) apply(l, COL_L);
if (r <= 10) apply(r, COL_R);
if (m <= 10) apply(m, COL_M);
}
let _writeConfigTimer = null;
@@ -298,7 +337,11 @@ async function _doWriteConfigBlob() {
| (document.getElementById('capAutoRecal').checked ? FLAG_AUTO_RECAL_ENABLED : 0);
// config.curve, config.chargeMode, config.tapAction, config.tapKey updated directly
const buf = new ArrayBuffer(25);
config.btnLeftPin = parseInt(document.getElementById('btnLeftPin').value, 10);
config.btnRightPin = parseInt(document.getElementById('btnRightPin').value, 10);
config.btnMiddlePin = parseInt(document.getElementById('btnMiddlePin').value, 10);
const buf = new ArrayBuffer(28);
const view = new DataView(buf);
view.setFloat32(0, config.sensitivity, true);
view.setFloat32(4, config.deadZone, true);
@@ -313,6 +356,9 @@ async function _doWriteConfigBlob() {
view.setUint8(19, config.tapFreezeEnabled);
view.setFloat32(20, config.jerkThreshold, true);
view.setUint8(24, config.featureFlags);
view.setUint8(25, config.btnLeftPin);
view.setUint8(26, config.btnRightPin);
view.setUint8(27, config.btnMiddlePin);
try {
await gattWrite(chars.configBlob, buf);
@@ -605,7 +651,7 @@ function setStatus(state) {
pill.className='status-pill '+state;
document.body.className=state;
const cBtn=document.getElementById('connectBtn'), dBtn=document.getElementById('disconnectBtn');
const inputs=document.querySelectorAll('input[type=range],.seg-btn,.toggle input,.cmd-btn,#tapKeyHex,.mod-btn input');
const inputs=document.querySelectorAll('input[type=range],.seg-btn,.toggle input,.cmd-btn,#tapKeyHex,.mod-btn input,.pin-select');
if (state==='connected') {
cBtn.style.display='none'; dBtn.style.display='';
inputs.forEach(el=>el.disabled=false);
@@ -972,6 +1018,7 @@ function applyTheme(t) {
localStorage.setItem('theme', t);
if (!chars.imuStream) drawInitState();
orientUpdateColors();
updatePinDiagram();
}
(function(){
const saved = localStorage.getItem('theme') ?? 'auto';