ESP32_ChinaDieselHeater_Con.../Arduino/BTCDieselHeater/data/uploadfirmware.html
Ray Jones 2ccd948001 Web update via OTA now under user control. Icon shows on header when an update is available.
Update can be commanded via the Version Information menu by pressing UP, CENTRE, UP. Prompt driven of course!
Removed Wifi Trigger pin - does not play nice with automatic COM port uploads!
Reverted to DS18B20 read from index 0 - allows plugging sensor in and re-discovery!
2019-05-20 22:09:59 +10:00

84 lines
2.7 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<script>
// global variables
var sendSize;
var Socket;
function _(el) {
return document.getElementById(el);
}
function init() {
Socket = new WebSocket('ws://' + window.location.hostname + ':81/');
Socket.onmessage = function(event){
var response = JSON.parse(event.data);
var key;
for(key in response) {
console.log("JSON decode:", key, response[key]);
switch(key) {
case "progress":
// actual data bytes received as fed back via web socket
var bytes = response[key];
_("loaded_n_total").innerHTML = "Uploaded " + bytes + " bytes of " + sendSize;
var percent = Math.round( 100 * (bytes / sendSize));
_("progressBar").value = percent;
_("status").innerHTML = percent+"% uploaded.. please wait";
break;
}
}
}
}
function uploadFile() {
_("cancel").hidden = true;
var file = _("file1").files[0];
sendSize = file.size;
var formdata = new FormData();
formdata.append("update", file);
var ajax = new XMLHttpRequest();
// progress is handled via websocket JSON sent from controller
// using server side progress only shows the buffer filling, not actual delivery.
ajax.addEventListener("load", completeHandler, false);
ajax.addEventListener("error", errorHandler, false);
ajax.addEventListener("abort", abortHandler, false);
ajax.open("POST", "/updatenow");
ajax.send(formdata);
}
function completeHandler(event) {
console.log(event);
_("status").innerHTML = event.target.responseText;
_("progressBar").value = 0;
_("loaded_n_total").innerHTML = "Uploaded " + sendSize + " bytes of " + sendSize;
setTimeout(function () {
window.location.assign("/");
}, 5000);
}
function errorHandler(event) {
console.log(event);
_("status").innerHTML = "Upload Failed";
}
function abortHandler(event) {
console.log(event);
_("status").innerHTML = "Upload Aborted";
}
</script>
<style>
body {font-family: Arial, Helvetica, sans-serif;}
</style>
<title>Afterburner firmware update</title>
</head>
<body onload="javascript:init()">
<h1>Afterburner firmware update</h1>
<form id='upload_form' method='POST' enctype='multipart/form-data'>
<input type='file' name='file1' id='file1'> <BR>
<input type='button' value='Update' onclick="uploadFile()">
<progress id="progressBar" value="0" max="100" style="width:300px;"></progress><BR>
<h3 id="status"></h3>
<p id="loaded_n_total"></p>
<BR>
<input type='button' onclick=window.location.assign("/") value='Cancel' id="cancel">
</form>
</body>
</html>