edi/lasertag
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Networkscan working! :)
Some checks failed
Deploy Docs / build-and-deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Eduard Iten
2026-01-02 18:42:10 +01:00
parent b40e44c991
commit d7f004ee72
5 changed files with 301 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

191
software/provisioning/index.html
View File

@@ -3,16 +3,18 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lasertag Provisioning</title>
<title>Lasertag Provisioning & Mesh Discovery</title>
<style>
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; display: flex; flex-direction: column; align-items: center; padding: 2rem; background: #f0f2f5; color: #333; }
.card { background: white; padding: 2rem; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); width: 100%; max-width: 550px; }
h1 { font-size: 1.5rem; margin-bottom: 1rem; color: #1a73e8; }
.status-box { padding: 0.75rem; border-radius: 6px; margin-bottom: 1.5rem; font-size: 0.9rem; background: #e8f0fe; color: #1967d2; border: 1px solid #d2e3fc; min-height: 20px; }
.button-group { display: flex; gap: 10px; width: 100%; flex-wrap: wrap; }
button { background: #1a73e8; color: white; border: none; padding: 10px 20px; border-radius: 6px; cursor: pointer; font-size: 1rem; width: 100%; font-weight: 600; transition: background 0.2s; margin-top: 10px; }
.button-group { display: flex; gap: 10px; width: 100%; flex-wrap: wrap; margin-bottom: 10px; }
button { background: #1a73e8; color: white; border: none; padding: 10px 20px; border-radius: 6px; cursor: pointer; font-size: 1rem; width: 100%; font-weight: 600; transition: background 0.2s; margin-top: 5px; }
button:hover { background: #1557b0; }
button:disabled { background: #ccc; cursor: not-allowed; }
.btn-danger { background: #d93025; }
.btn-danger:hover { background: #a50e0e; }
.btn-secondary { background: #5f6368; }
@@ -24,12 +26,17 @@
.config-section { margin-top: 1.5rem; }
.config-group { margin-bottom: 1rem; border-bottom: 1px solid #eee; padding-bottom: 1rem; }
.config-group:last-child { border-bottom: none; }
label { display: block; font-size: 0.85rem; color: #666; margin-bottom: 4px; font-weight: bold; }
.input-row { display: flex; gap: 8px; }
input { flex-grow: 1; padding: 8px; border: 1px solid #ccc; border-radius: 4px; font-size: 0.9rem; font-family: monospace; }
.btn-small { width: auto; font-size: 0.85rem; padding: 8px 16px; margin-top: 0; }
.node-list { margin-top: 1rem; background: #f8f9fa; border-radius: 6px; padding: 10px; border: 1px solid #ddd; min-height: 40px; }
.node-item { padding: 5px 0; border-bottom: 1px solid #eee; font-size: 0.9rem; display: flex; align-items: center; }
.node-item:last-child { border-bottom: none; }
.hint { font-size: 0.8rem; color: #888; margin-top: 1rem; font-style: italic; }
.action-bar { display: flex; gap: 10px; margin-bottom: 15px; }
</style>
</head>
<body>
@@ -38,16 +45,16 @@
<div class="status-box" id="status">Bereit zum Scannen...</div>
<div class="button-group">
<button id="connectBtn">Gerät suchen</button>
<button id="connectBtn">Gerät suchen & verbinden</button>
<button id="disconnectBtn" class="btn-danger" style="display: none;">Trennen</button>
</div>
<div class="config-section" id="globalActions" style="margin-top: 20px;">
<div class="config-section" id="globalActions">
<label>Globale Aktionen</label>
<div class="button-group">
<button id="genParamsBtn" class="btn-secondary">Zufallsparameter generieren</button>
<button id="saveToCookieBtn" class="btn-secondary">Netzwerk im Browser merken</button>
<button id="loadFromCookieBtn" class="btn-success" style="display: none;">Gemerktes Netzwerk auf Node schreiben</button>
<button id="saveToStorageBtn" class="btn-secondary">Netzwerk im Browser merken</button>
<button id="loadFromStorageBtn" class="btn-success" style="display: none;">Gemerktes Netzwerk auf Node schreiben</button>
</div>
</div>
@@ -106,6 +113,13 @@
<button class="btn-small" id="saveKeyBtn">Setzen</button>
</div>
</div>
<!-- Mesh Discovery Section -->
<div class="config-group">
<label>Entdeckte Mesh-Knoten (via CoAP)</label>
<div id="nodeListContainer" class="node-list">Keine Knoten entdeckt.</div>
<button id="refreshNodesBtn" class="btn-secondary" style="margin-top: 8px;">Mesh scannen</button>
</div>
</div>
<p class="hint">Hinweis: Alle Änderungen werden im NVS gespeichert. Ein Reboot ist erforderlich, um Thread neu zu starten.</p>
@@ -117,10 +131,13 @@
const disconnectBtn = document.getElementById('disconnectBtn');
const status = document.getElementById('status');
const deviceInfo = document.getElementById('deviceInfo');
const saveToCookieBtn = document.getElementById('saveToCookieBtn');
const loadFromCookieBtn = document.getElementById('loadFromCookieBtn');
const genParamsBtn = document.getElementById('genParamsBtn');
const saveToStorageBtn = document.getElementById('saveToStorageBtn');
const loadFromStorageBtn = document.getElementById('loadFromStorageBtn');
const genParamsBtn = document.getElementById('genParamsBtn');
const refreshNodesBtn = document.getElementById('refreshNodesBtn');
const nodeListContainer = document.getElementById('nodeListContainer');
const nameInput = document.getElementById('nameInput');
const netNameInput = document.getElementById('netNameInput');
const panInput = document.getElementById('panInput');
@@ -129,9 +146,10 @@
const keyInput = document.getElementById('keyInput');
let bluetoothDevice = null;
let gattServer = null;
let provService = null;
// UUIDs passend zur Firmware
// Bluetooth UUIDs from Firmware
const SERVICE_UUID = '03afe2cf-6c64-4a22-9289-c3ae820cbc00';
const NAME_CHAR = '03afe2cf-6c64-4a22-9289-c3ae820cbc01';
const PANID_CHAR = '03afe2cf-6c64-4a22-9289-c3ae820cbc02';
@@ -139,13 +157,19 @@
const EXTPAN_CHAR = '03afe2cf-6c64-4a22-9289-c3ae820cbc04';
const NETKEY_CHAR = '03afe2cf-6c64-4a22-9289-c3ae820cbc05';
const NETNAME_CHAR = '03afe2cf-6c64-4a22-9289-c3ae820cbc06';
const NODES_CHAR = '03afe2cf-6c64-4a22-9289-c3ae820cbc07';
// Check if we have saved network settings
function updateLoadButtonVisibility() {
// Utility: Visibility of load button
function updateUIState() {
const saved = localStorage.getItem('lasertag_net_config');
loadFromCookieBtn.style.display = (saved && bluetoothDevice && bluetoothDevice.gatt.connected) ? 'inline-block' : 'none';
const connected = bluetoothDevice && bluetoothDevice.gatt.connected;
loadFromStorageBtn.style.display = (saved && connected) ? 'inline-block' : 'none';
disconnectBtn.style.display = connected ? 'inline-block' : 'none';
connectBtn.style.display = connected ? 'none' : 'inline-block';
deviceInfo.style.display = connected ? 'block' : 'none';
}
// Utility: Conversions
function hexToBytes(hex) {
let bytes = [];
for (let c = 0; c < hex.length; c += 2)
@@ -163,9 +187,10 @@
return bytesToHex(arr);
}
// BLE Reading
async function readAll() {
try {
status.textContent = 'Lese Konfiguration...';
status.textContent = 'Lese Konfiguration vom Node...';
// Name
const nameData = await (await provService.getCharacteristic(NAME_CHAR)).readValue();
@@ -192,49 +217,13 @@
keyInput.value = bytesToHex(new Uint8Array(keyData.buffer));
status.textContent = 'Verbunden mit ' + bluetoothDevice.name;
updateLoadButtonVisibility();
updateUIState();
} catch (e) {
status.textContent = 'Fehler beim Lesen: ' + e.message;
}
}
connectBtn.addEventListener('click', async () => {
try {
bluetoothDevice = await navigator.bluetooth.requestDevice({
filters: [{ services: [SERVICE_UUID] }]
});
status.textContent = 'Verbinde...';
const server = await bluetoothDevice.gatt.connect();
provService = await server.getPrimaryService(SERVICE_UUID);
deviceInfo.style.display = 'block';
disconnectBtn.style.display = 'inline-block';
connectBtn.style.display = 'none';
await readAll();
bluetoothDevice.addEventListener('gattserverdisconnected', onDisconnected);
} catch (error) {
status.textContent = 'Suche abgebrochen oder Fehler: ' + error.message;
}
});
disconnectBtn.addEventListener('click', () => {
if (bluetoothDevice && bluetoothDevice.gatt.connected) {
bluetoothDevice.gatt.disconnect();
}
});
function onDisconnected() {
status.textContent = 'Verbindung getrennt.';
deviceInfo.style.display = 'none';
disconnectBtn.style.display = 'none';
connectBtn.style.display = 'inline-block';
provService = null;
updateLoadButtonVisibility();
}
// BLE Writing helper
async function writeValue(uuid, data) {
if (!provService) return;
try {
@@ -248,7 +237,37 @@
}
}
// Global Action: Generate Random Params
// Event Listeners
connectBtn.addEventListener('click', async () => {
try {
bluetoothDevice = await navigator.bluetooth.requestDevice({
filters: [{ services: [SERVICE_UUID] }]
});
status.textContent = 'Verbinde mit GATT Server...';
gattServer = await bluetoothDevice.gatt.connect();
provService = await gattServer.getPrimaryService(SERVICE_UUID);
await readAll();
bluetoothDevice.addEventListener('gattserverdisconnected', onDisconnected);
} catch (error) {
status.textContent = 'Suche abgebrochen: ' + error.message;
}
});
disconnectBtn.addEventListener('click', () => {
if (bluetoothDevice && bluetoothDevice.gatt.connected) {
bluetoothDevice.gatt.disconnect();
}
});
function onDisconnected() {
status.textContent = 'Verbindung getrennt.';
provService = null;
updateUIState();
}
// Action: Generate Random Params
genParamsBtn.addEventListener('click', () => {
panInput.value = generateRandomHex(4);
extPanInput.value = generateRandomHex(16);
@@ -257,8 +276,8 @@
status.textContent = 'Zufallsparameter generiert.';
});
// Global Action: Save to Local Storage
saveToCookieBtn.addEventListener('click', () => {
// Action: Save to Local Storage
saveToStorageBtn.addEventListener('click', () => {
const config = {
netName: netNameInput.value,
panId: panInput.value,
@@ -267,44 +286,43 @@
netKey: keyInput.value
};
localStorage.setItem('lasertag_net_config', JSON.stringify(config));
status.textContent = 'Netzwerk-Einstellungen lokal gemerkt.';
updateLoadButtonVisibility();
status.textContent = 'Netzwerk-Einstellungen im Browser gespeichert.';
updateUIState();
});
// Global Action: Load and Write to Node
loadFromCookieBtn.addEventListener('click', async () => {
// Action: Load from Local Storage and Batch-Write
loadFromStorageBtn.addEventListener('click', async () => {
const saved = localStorage.getItem('lasertag_net_config');
if (!saved || !provService) return;
try {
const config = JSON.parse(saved);
status.textContent = 'Schreibe gemerktes Netzwerk...';
status.textContent = 'Batch-Schreibvorgang läuft...';
// Write each setting
const encoder = new TextEncoder();
// Net Name
// 1. Net Name
await (await provService.getCharacteristic(NETNAME_CHAR)).writeValue(encoder.encode(config.netName));
// PAN ID
// 2. PAN ID
const panView = new DataView(new ArrayBuffer(2));
panView.setUint16(0, parseInt(config.panId, 16), true);
await (await provService.getCharacteristic(PANID_CHAR)).writeValue(panView.buffer);
// Channel
// 3. Channel
const chanView = new DataView(new ArrayBuffer(1));
chanView.setUint8(0, parseInt(config.channel));
await (await provService.getCharacteristic(CHAN_CHAR)).writeValue(chanView.buffer);
// Ext PAN
// 4. Ext PAN
await (await provService.getCharacteristic(EXTPAN_CHAR)).writeValue(hexToBytes(config.extPanId));
// Net Key
// 5. Net Key
await (await provService.getCharacteristic(NETKEY_CHAR)).writeValue(hexToBytes(config.netKey));
status.textContent = 'Netzwerk vollständig übertragen!';
// Update UI fields to show what was written
// Sync UI
netNameInput.value = config.netName;
panInput.value = config.panId;
chanInput.value = config.channel;
@@ -316,7 +334,38 @@
}
});
// Manual Saves
// Action: Discovery (CoAP)
refreshNodesBtn.addEventListener('click', async () => {
if (!provService) return;
try {
status.textContent = 'Triggere Mesh-Discovery...';
const char = await provService.getCharacteristic(NODES_CHAR);
// Write triggers discovery on the nRF node
await char.writeValue(new Uint8Array([1]));
status.textContent = 'Warte auf CoAP Antworten...';
nodeListContainer.innerHTML = "Scanne...";
// Wait 3 seconds for CoAP responses to arrive and be processed
setTimeout(async () => {
const data = await char.readValue();
const listStr = new TextDecoder().decode(data);
if (listStr.trim() === "") {
nodeListContainer.innerHTML = "Keine anderen Knoten gefunden.";
} else {
const nodes = listStr.split(',');
nodeListContainer.innerHTML = nodes.map(n => `<div class="node-item">📡 ${n}</div>`).join('');
}
status.textContent = 'Mesh-Scan abgeschlossen.';
}, 3000);
} catch (e) {
status.textContent = 'Scan fehlgeschlagen: ' + e.message;
}
});
// Manual Save Handlers
document.getElementById('saveNameBtn').addEventListener('click', () =>
writeValue(NAME_CHAR, new TextEncoder().encode(nameInput.value)));
@@ -341,6 +390,8 @@
document.getElementById('saveKeyBtn').addEventListener('click', () =>
writeValue(NETKEY_CHAR, hexToBytes(keyInput.value)));
// Initial check for stored config
updateUIState();
</script>
</body>
</html>