show progress for flashing

This commit is contained in:
liamcottle
2024-07-14 19:35:29 +12:00
parent 163a91ea48
commit e4ff432f31
2 changed files with 62 additions and 14 deletions

View File

@@ -18,23 +18,41 @@
</head>
<body>
<div id="app" class="space-y-1">
<div id="app" class="space-y-2">
<div>
<button @click="enterDfuMode" class="border px-2 bg-gray-100 hover:bg-gray-200 rounded">
<div>1. Put device into DFU Mode</div>
<button @click="enterDfuMode" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded">
Enter DFU Mode
</button>
</div>
<div>
<input ref="file" type="file"/>
<button @click="flash" class="border px-2 bg-gray-100 hover:bg-gray-200 rounded">
Flash
</button>
<div>2. Select firmware.zip to flash</div>
<div class="mb-1">
<input ref="file" type="file"/>
</div>
<div v-if="!isFlashing">
<button @click="flash" :disabled="isFlashing" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded">
Flash Now
</button>
</div>
<div v-else>
<span v-if="progress > 0">Flashing: {{progress}}%</span>
<span v-else>Flashing: please wait...</span>
<div class="mt-1 w-[200px] overflow-hidden rounded-full bg-gray-200">
<div class="h-2 rounded-full bg-blue-600" :style="{ 'width': `${progress}%`}"></div>
</div>
</div>
</div>
<div>
<button @click="detect" class="border px-2 bg-gray-100 hover:bg-gray-200 rounded">
<div>3. After flashing, Detect RNode version</div>
<button @click="detect" class="border border-gray-500 px-2 bg-gray-100 hover:bg-gray-200 rounded">
Detect
</button>
</div>
@@ -45,7 +63,8 @@
Vue.createApp({
data() {
return {
isFlashing: false,
progress: 0,
};
},
mounted() {
@@ -94,8 +113,16 @@
}
// flash file
this.isFlashing = true;
this.progress = 0;
const flasher = new Nrf52DfuFlasher(serialPort);
await flasher.flash(file);
await flasher.flash(file, (percentage) => {
this.progress = percentage;
if(this.progress === 100){
this.isFlashing = false;
alert("Firmware has been flashed!");
}
});
},
async detect() {

View File

@@ -86,9 +86,10 @@ class Nrf52DfuFlasher {
/**
* Flashes the provided firmware zip.
* @param firmwareZipBlob
* @param progressCallback
* @returns {Promise<void>}
*/
async flash(firmwareZipBlob) {
async flash(firmwareZipBlob, progressCallback) {
// read zip file
const blobReader = new window.zip.BlobReader(firmwareZipBlob);
@@ -122,7 +123,7 @@ class Nrf52DfuFlasher {
// flash application image
if(manifest.application){
await this.dfuSendImage(this.HEX_TYPE_APPLICATION, zipEntries, manifest.application);
await this.dfuSendImage(this.HEX_TYPE_APPLICATION, zipEntries, manifest.application, progressCallback);
}
}
@@ -132,9 +133,10 @@ class Nrf52DfuFlasher {
* @param programMode
* @param zipEntries
* @param firmwareManifest
* @param progressCallback
* @returns {Promise<void>}
*/
async dfuSendImage(programMode, zipEntries, firmwareManifest) {
async dfuSendImage(programMode, zipEntries, firmwareManifest, progressCallback) {
// open port
await this.serialPort.open({
@@ -174,7 +176,7 @@ class Nrf52DfuFlasher {
await this.sendInitPacket(init_packet);
console.log("Sending firmware file")
await this.sendFirmware(firmware);
await this.sendFirmware(firmware, progressCallback);
// close port
console.log("Closing Port");
@@ -353,11 +355,13 @@ class Nrf52DfuFlasher {
/**
* Sends the firmware file to the device in multiple chunks.
* @param firmware
* @param progressCallback
* @returns {Promise<void>}
*/
async sendFirmware(firmware) {
async sendFirmware(firmware, progressCallback) {
const packets = [];
var packetsSent = 0;
// chunk firmware into separate packets
for(let i = 0; i < firmware.length; i += this.DFU_PACKET_MAX_SIZE){
@@ -367,6 +371,11 @@ class Nrf52DfuFlasher {
]));
}
// send initial progress
if(progressCallback){
progressCallback(0);
}
// send each packet one after the other
for(var i = 0; i < packets.length; i++){
@@ -376,6 +385,13 @@ class Nrf52DfuFlasher {
// wait a bit to allow device to write before sending next packet
await this.sleepMillis(this.FLASH_PAGE_WRITE_TIME * 1000);
// update progress
packetsSent++;
if(progressCallback){
const progress = Math.floor((packetsSent / packets.length) * 100);
progressCallback(progress);
}
}
// finished sending firmware, send DFU Stop Data packet
@@ -383,6 +399,11 @@ class Nrf52DfuFlasher {
...this.int32ToBytes(this.DFU_STOP_DATA_PACKET),
]));
// send final progress
if(progressCallback){
progressCallback(100);
}
}
/**