Files
web-bluetooth-dfu/example_web.html

109 lines
3.4 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>web-bluetooth-dfu</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<style>
html, body { width: 100%; padding: 0; margin: 0; font-family: sans-serif; }
input { font-size: 20px; }
button { font-size: 20px; padding: 0 20px; display: block; margin: 20px auto; }
.device-type { width: 160px; margin: 20px auto; white-space: nowrap; }
</style>
</head>
<body>
<div class="device-type">
<input type="radio" name="device-type" id="nrf51" checked>
<label for="nrf51">nRF51</label>
<input type="radio" name="device-type" id="nrf52">
<label for="nrf52">nRF52</label>
</div>
<button onclick="setMode()">Set Mode</button>
<button onclick="findDFU()">Transfer</button>
<button onclick="both()">Both</button>
<div id="results"></div>
<script src="dist/dfu.js"></script>
<script src="dist/hex2bin.js"></script>
<script src="dist/crc16.js"></script>
<script>
var resultsEl = document.getElementById("results");
var urlBase = "//thegecko.github.io/web-bluetooth-dfu/firmware/";
function log(message) {
console.log(message);
resultsEl.innerText += message + "\n";
}
dfu.addLogger(log);
function download(url) {
return new Promise(function(resolve, reject) {
var xhr = new XMLHttpRequest();
xhr.addEventListener("load", function() {
resolve(this.responseText);
});
xhr.open("GET", url);
xhr.send();
});
}
function transfer(device) {
return new Promise(function(resolve, reject) {
var url = "";
var deviceType = document.querySelector('input[name="device-type"]:checked').id;
switch(deviceType) {
case "nrf51":
url = urlBase + "nrf51_app_{0}.hex";
url = url.replace("{0}", device.name === "Hi_Rob" ? "bye" : "hi");
break;
case "nrf52":
url = urlBase + "nrf52_app.hex";
break;
}
download(url)
.then(hex => {
var buffer = hex2bin(hex);
log("downloaded length: " + buffer.byteLength);
var crc = crc16(buffer);
return dfu.provision(device, buffer, 4, crc);
})
.then(() => {
log('dfu complete');
resolve();
})
.catch(error => {
log(error);
reject(error);
});
});
}
function setMode() {
dfu.findDevice({ services: [0x180D] })
.then(device => dfu.writeMode(device))
.catch(log);
}
function findDFU() {
dfu.findDevice({ name: "DfuTarg" })
.then(device => transfer(device))
.catch(log);
}
function both() {
dfu.findDevice({ services: [0x180D] })
.then(device => dfu.writeMode(device))
.then(device => transfer(device))
.catch(log);
}
</script>
</body>
</html>