bryan
/
BangleApps
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

hidjoystick 

Emulate buttons 2-5 with touchscreen on BangleJs2
master
Erik Andresen 2022-03-19 22:10:05 +01:00
parent 802bd08173
commit f4a467fbe6
2 changed files with 57 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
apps/hidjoystick/app.js
View File

@ -2,11 +2,15 @@ const storage = require('Storage');
const Layout = require("Layout"); const Layout = require("Layout");
const settings = storage.readJSON('setting.json',1) || { HID: false }; const settings = storage.readJSON('setting.json',1) || { HID: false };
const BANGLEJS2 = process.env.HWVERSION == 2; const BANGLEJS2 = process.env.HWVERSION == 2;
const buttonWidth = Bangle.appRect.w/2; const sidebarWidth=18;
const buttonWidth = (Bangle.appRect.w-sidebarWidth)/2;
const buttonHeight = (Bangle.appRect.h-16)/2*0.85; // subtract text row and add a safety margin const buttonHeight = (Bangle.appRect.h-16)/2*0.85; // subtract text row and add a safety margin
var sendInProgress = false; // Only send one message at a time, do not flood var sendInProgress = false; // Only send one message at a time, do not flood
var touchBtn2 = 0;
var touchBtn3 = 0;
var touchBtn4 = 0;
var touchBtn5 = 0;
function renderBtnArrows(l) { function renderBtnArrows(l) {
const d = g.getWidth() - l.width; const d = g.getWidth() - l.width;
@ -27,17 +31,57 @@ function renderBtnArrows(l) {
} }
} }
const layoutChilden = [];
if (BANGLEJS2) { // add virtual buttons in display
layoutChilden.push({type:"h", c:[
{type:"btn", width:buttonWidth, height:buttonHeight, label:"BTN2", id:"touchBtn2" },
{type:"btn", width:buttonWidth, height:buttonHeight, label:"BTN3", id:"touchBtn3" },
]});
}
layoutChilden.push({type:"h", c:[
{type:"txt", font:"6x8:2", label:"Joystick" },
]});
if (BANGLEJS2) { // add virtual buttons in display
layoutChilden.push({type:"h", c:[
{type:"btn", width:buttonWidth, height:buttonHeight, label:"BTN4", id:"touchBtn4" },
{type:"btn", width:buttonWidth, height:buttonHeight, label:"BTN5", id:"touchBtn5" },
]});
}
const layout = new Layout( const layout = new Layout(
{type:"h", c:[ {type:"h", c:[
{type:"v", width:Bangle.appRect.w-18, c: [ {type:"v", width:Bangle.appRect.w-sidebarWidth, c: layoutChilden},
{type:"h", c:[ {type:"custom", width:18, height: Bangle.appRect.h, render:renderBtnArrows }
{type:"txt", font:"6x8:2", label:"Joystick"},
]}
]},
{type:"custom", width:18, height: Bangle.appRect.h, render:renderBtnArrows}
]} ]}
); );
function isInBox(box, x, y) {
return x >= box.x && x < box.x+box.w && y >= box.y && y < box.y+box.h;
}
if (BANGLEJS2) {
Bangle.on('drag', function(event) {
if (event.b == 0) { // release
touchBtn2 = touchBtn3 = touchBtn4 = touchBtn5 = 0;
} else if (isInBox(layout.touchBtn2, event.x, event.y)) {
touchBtn2 = 1;
touchBtn3 = touchBtn4 = touchBtn5 = 0;
} else if (isInBox(layout.touchBtn3, event.x, event.y)) {
touchBtn3 = 1;
touchBtn2 = touchBtn4 = touchBtn5 = 0;
} else if (isInBox(layout.touchBtn4, event.x, event.y)) {
touchBtn4 = 1;
touchBtn2 = touchBtn3 = touchBtn5 = 0;
} else if (isInBox(layout.touchBtn5, event.x, event.y)) {
touchBtn5 = 1;
touchBtn2 = touchBtn3 = touchBtn4 = 0;
} else {
// outside any buttons, release all
touchBtn2 = touchBtn3 = touchBtn4 = touchBtn5 = 0;
}
});
}
const sendHid = function (x, y, btn1, btn2, btn3, btn4, btn5, cb) { const sendHid = function (x, y, btn1, btn2, btn3, btn4, btn5, cb) {
try { try {
const buttons = (btn5<<4) | (btn4<<3) | (btn3<<2) | (btn2<<1) | (btn1<<0); const buttons = (btn5<<4) | (btn4<<3) | (btn3<<2) | (btn2<<1) | (btn1<<0);
@ -62,10 +106,10 @@ function drawApp() {
function update() { function update() {
const btn1 = BTN1 ? BTN1.read() : 0; const btn1 = BTN1 ? BTN1.read() : 0;
const btn2 = !BANGLEJS2 ? BTN2.read() : 0; const btn2 = !BANGLEJS2 ? BTN2.read() : touchBtn2;
const btn3 = !BANGLEJS2 ? BTN3.read() : 0; const btn3 = !BANGLEJS2 ? BTN3.read() : touchBtn3;
const btn4 = !BANGLEJS2 ? BTN4.read() : 0; const btn4 = !BANGLEJS2 ? BTN4.read() : touchBtn4;
const btn5 = !BANGLEJS2 ? BTN5.read() : 0; const btn5 = !BANGLEJS2 ? BTN5.read() : touchBtn5;
const acc = Bangle.getAccel(); const acc = Bangle.getAccel();
var x = acc.x*-127; var x = acc.x*-127;
var y = acc.y*-127; var y = acc.y*-127;

2
apps/hidjoystick/metadata.json
View File

@ -3,7 +3,7 @@
"name": "Bluetooth Joystick", "name": "Bluetooth Joystick",
"shortName": "Joystick", "shortName": "Joystick",
"version": "0.02", "version": "0.02",
"description": "Emulates a 2 axis/5 button Joystick using the accelerometer as stick input and buttons 1-3, touch left as button 4 and touch right as button 5. On Bangle.js 2 only one button is supported at this moment)", "description": "Emulates a 2 axis/5 button Joystick using the accelerometer as stick input and buttons 1-3, touch left as button 4 and touch right as button 5. On Bangle.js 2 buttons 2-5 are emulated with the touchscreen.",
"icon": "app.png", "icon": "app.png",
"tags": "bluetooth", "tags": "bluetooth",
"supports": ["BANGLEJS", "BANGLEJS2"], "supports": ["BANGLEJS", "BANGLEJS2"],