adust pcb to new 3.3 software improvements

This commit is contained in:
2024-12-30 20:19:37 +01:00
parent 58b63fc8ee
commit 1927449c1d
22 changed files with 16833 additions and 13984 deletions

View File

@@ -65,4 +65,15 @@ interface Moistures {
interface VersionInfo {
git_hash: string,
build_time: string
}
interface BatteryState {
temperature: string
voltage_milli_volt: string,
current_milli_ampere: string,
cycle_count: string,
design_milli_ampere: string,
remaining_milli_ampere: string,
state_of_charge: string,
state_of_health: string
}

View File

@@ -0,0 +1,46 @@
<div class="container col-sm-6 col-md-5" style="border-style: solid; border-width: 1px; padding: 8px; margin: 8px;" >
<div class="row">
<div class="col-7">
</div>
<div class="col-7" style="text-align: center; font-weight: bold;">
Time:
</div>
<div style="display: block; right: 8px; position: absolute;">
<input id="battery_auto_refresh" type="checkbox">
</div>
</div>
<div class="row">
<span class="col-7">V:</span>
<div class="col-5" id="battery_voltage_milli_volt" style="text-wrap: nowrap"></div>
</div>
<div class="row">
<span class="col-7">mA:</span>
<div class="col-5" id="battery_current_milli_ampere" style="text-wrap: nowrap"></div>
</div>
<div class="row">
<span class="col-7">Cycles:</span>
<div class="col-5" id="battery_cycle_count" style="text-wrap: nowrap"></div>
</div>
<div class="row">
<span class="col-7">design mA:</span>
<div class="col-5" id="battery_design_milli_ampere" style="text-wrap: nowrap"></div>
</div>
<div class="row">
<span class="col-7">remaining mA:</span>
<div class="col-5" id="battery_remaining_milli_ampere" style="text-wrap: nowrap"></div>
</div>
<div class="row">
<span class="col-7">charge %:</span>
<div class="col-5" id="battery_state_of_charge" style="text-wrap: nowrap"></div>
</div>
<div class="row">
<span class="col-7">health %:</span>
<div class="col-5" id="battery_state_of_health" style="text-wrap: nowrap"></div>
</div>
<div class="row">
<span class="col-7">Temp °C:</span>
<div class="col-5" id="battery_temperature" style="text-wrap: nowrap"></div>
</div>
</div>

View File

@@ -0,0 +1,69 @@
import { Controller } from "./main";
export class BatteryView{
voltage_milli_volt: HTMLSpanElement;
current_milli_ampere: HTMLSpanElement;
cycle_count: HTMLSpanElement;
design_milli_ampere: HTMLSpanElement;
remaining_milli_ampere: HTMLSpanElement;
state_of_charge: HTMLSpanElement;
state_of_health: HTMLSpanElement;
temperature: HTMLSpanElement;
auto_refresh: HTMLInputElement;
timer: NodeJS.Timeout | undefined;
controller: Controller;
constructor (controller:Controller) {
(document.getElementById("batteryview") as HTMLElement).innerHTML = require("./batteryview.html")
this.voltage_milli_volt = document.getElementById("battery_voltage_milli_volt") as HTMLSpanElement;
this.current_milli_ampere = document.getElementById("battery_current_milli_ampere") as HTMLSpanElement;
this.cycle_count = document.getElementById("battery_cycle_count") as HTMLSpanElement;
this.design_milli_ampere = document.getElementById("battery_design_milli_ampere") as HTMLSpanElement;
this.remaining_milli_ampere = document.getElementById("battery_remaining_milli_ampere") as HTMLSpanElement;
this.state_of_charge = document.getElementById("battery_state_of_charge") as HTMLSpanElement;
this.state_of_health = document.getElementById("battery_state_of_health") as HTMLSpanElement;
this.temperature = document.getElementById("battery_temperature") as HTMLSpanElement;
this.auto_refresh = document.getElementById("battery_auto_refresh") as HTMLInputElement;
this.controller = controller
this.auto_refresh.onchange = () => {
if(this.timer){
clearTimeout(this.timer)
}
if(this.auto_refresh.checked){
controller.updateBatteryData()
}
}
}
update(batterystate: BatteryState|null){
if (batterystate == null) {
this.voltage_milli_volt.innerText = "N/A"
this.current_milli_ampere.innerText = "N/A"
this.cycle_count.innerText = "N/A"
this.design_milli_ampere.innerText = "N/A"
this.remaining_milli_ampere.innerText = "N/A"
this.state_of_charge.innerText = "N/A"
this.state_of_health.innerText = "N/A"
this.temperature.innerText = "N/A"
} else {
this.voltage_milli_volt.innerText = String(+batterystate.voltage_milli_volt/1000)
this.current_milli_ampere.innerText = batterystate.current_milli_ampere
this.cycle_count.innerText = batterystate.cycle_count
this.design_milli_ampere.innerText = batterystate.design_milli_ampere
this.remaining_milli_ampere.innerText = batterystate.remaining_milli_ampere
this.state_of_charge.innerText = batterystate.state_of_charge
this.state_of_health.innerText = batterystate.state_of_health
this.temperature.innerText = String(+batterystate.temperature / 100)
}
if(this.auto_refresh.checked){
this.timer = setTimeout(this.controller.updateBatteryData, 1000);
} else {
if(this.timer){
clearTimeout(this.timer)
}
}
}
}

View File

@@ -1,4 +1,3 @@
<div class="container-xxl">
<link rel="stylesheet" href="bootstrap-grid.css">
<style>
.progressPane{
@@ -66,69 +65,29 @@
</style>
<div id="progressPane" class="progressPane">
<div class="progressPaneCenter">
<div id="progressPaneBar" class="progress" data-label="50% Complete">
<span id="progressPaneSpan" class="value" style="width:100%;"></span>
</div>
</div>
</div>
<div class="container-xxl">
<input type="button" id="test" value="Test">
<h2>Current Firmware</h2>
<div>
<div id="firmware_buildtime">Buildtime loading</div>
<div id="firmware_githash">Build githash loading</div>
<div id="firmwareview">
</div>
<h2>firmeware OTA v3</h2>
<form id="upload_form" method="post">
<input type="file" name="file1" id="firmware_file"><br>
<progress id="firmware_progressBar" value="0" max="100" style="width:300px;"></progress>
<h3 id="firmware_status"></h3>
<h3 id="firmware_answer"></h3>
<p id="firmware_loaded_n_total"></p>
</form>
<div id="timeview">
</div>
<div id="network_view">
</div>
<div id="tankview"></div>
<div id="batteryview"></div>
<h2>config</h2>
<div id="configform">
<h3>Tank:</h3>
<div>
<input type="checkbox" id="tank_sensor_enabled">
Enable Tank Sensor
</div>
<div>
<input type="checkbox" id="tank_allow_pumping_if_sensor_error">
Allow Pumping if Sensor Error
</div>
<div>
<input type="number" min="2" max="500000" id="tank_useable_ml">
Tank Size mL
</div>
<div>
<input type="number" min="1" max="500000" id="tank_warn_percent">
Tank Warn Percent (mapped in relation to empty and full)
</div>
<div>
<input type="number" min="0" max="100" id="tank_empty_percent">
Tank Empty Percent (% max move)
</div>
<div>
<input type="number" min="0" max="100" id="tank_full_percent">
Tank Full Percent (% max move)
</div>
<h3>Light:</h3>
<input type="checkbox" id="night_lamp_enabled" checked="false"> Enable Nightlight
@@ -154,4 +113,12 @@
<br>
<textarea id="json" cols=50 rows=10></textarea>
<script src="bundle.js"></script>
</div>
<div id="progressPane" class="progressPane">
<div class="progressPaneCenter">
<div id="progressPaneBar" class="progress" data-label="50% Complete">
<span id="progressPaneSpan" class="value" style="width:100%;"></span>
</div>
</div>
</div>

View File

@@ -9,10 +9,11 @@ import { TimeView } from "./timeview";
import { PlantView, PlantViews } from "./plant";
import { NetworkConfigView } from "./network";
import { NightLampView } from "./nightmode";
import { TankConfigView } from "./tanks";
import { TankConfigView } from "./tankview";
import { SubmitView } from "./submitView";
import { ProgressView } from "./progress";
import { OTAView } from "./ota";
import { BatteryView } from "./batteryview";
export class Controller {
updateRTCData() {
@@ -27,6 +28,18 @@ export class Controller {
console.log(error);
});
}
updateBatteryData() {
fetch(PUBLIC_URL + "/battery")
.then(response => response.json())
.then(json => json as BatteryState)
.then(battery => {
controller.batteryView.update(battery)
})
.catch(error => {
controller.batteryView.update(null)
console.log(error);
});
}
uploadNewFirmware(file: File) {
var current = 0;
var max = 100;
@@ -226,11 +239,13 @@ export class Controller {
readonly submitView: SubmitView;
readonly firmWareView : OTAView;
readonly progressview: ProgressView;
readonly batteryView: BatteryView;
constructor() {
this.timeView = new TimeView(this)
this.plantViews = new PlantViews(this)
this.networkView = new NetworkConfigView(this, PUBLIC_URL)
this.tankView = new TankConfigView(this)
this.batteryView = new BatteryView(this)
this.nightLampView = new NightLampView(this)
this.submitView = new SubmitView(this)
this.firmWareView = new OTAView(this)
@@ -239,6 +254,8 @@ export class Controller {
}
const controller = new Controller();
controller.updateRTCData();
controller.updateBatteryData();
controller.downloadConfig();
controller.measure_moisture();
n controller.measure_moisture();
controller.version();

View File

@@ -0,0 +1,22 @@
<div class="container col-12 col-sm-7 col-md-7" style="border-width: 1px; border-style: solid; padding: 8px; margin: 8px;">
<div class="row">
<div class="col-12" style="text-align: center; font-weight: bold;">
Current Firmware
</div>
</div>
<div class="row">
<div class="col-6">
<span>Buildtime:</span>
<span id="firmware_buildtime" style="text-wrap: nowrap"></span>
</div>
<div class="col-md-6">
<span>Buildhash:</span>
<span id="firmware_githash" style="text-wrap: nowrap"></span>
</div>
</div>
<div class="row">
<form class="col-12" id="upload_form" method="post">
<input type="file" name="file1" id="firmware_file"><br>
</form>
</div>
</div>

View File

@@ -6,6 +6,8 @@ export class OTAView {
firmware_githash: HTMLDivElement;
constructor(controller: Controller) {
(document.getElementById("firmwareview") as HTMLElement).innerHTML = require("./ota.html")
this.firmware_buildtime = document.getElementById("firmware_buildtime") as HTMLDivElement;
this.firmware_githash = document.getElementById("firmware_githash") as HTMLDivElement;

View File

@@ -1,35 +1,59 @@
<h4 id="plant_${plantId}_header">Plant ${plantId}</h4>
<div>
<button id="plant_${plantId}_test">Test</button>
<div class="container" style="border-style: solid; border-width: 1px; margin: 8px; padding: 8px;">
<span class="row col-12" style="font-weight: bold; display: block; text-align: center;" id="plant_${plantId}_header">Plant ${plantId}</span>
<div class="row">
<div class="col-1"></div>
<button class="col-10" id="plant_${plantId}_test">Test</button>
<div class="col-1"></div>
</div>
<div>
Current:
<br>
Sensor A:<span id="plant_${plantId}_moisture_a">loading</span>
<br>
Sensor b:<span id="plant_${plantId}_moisture_b">loading</span>
<div class="row">
<div class="col-12">Live:</div>
</div>
<div class="row">
<div class="col-7">Sensor A:</div>
<span class="col-4" id="plant_${plantId}_moisture_a">loading</span>
<div class="col-7">Sensor B:</div>
<span class="col-4" id="plant_${plantId}_moisture_b">loading</span>
</div>
<div class="row">
<div class="col-7">
Mode:
</div>
<select class="col-4" id="plant_${plantId}_mode">
<option value="OFF">Off</option>
<option value="TargetMoisture">Target</option>
<option value="TimerOnly">Timer</option>
</select>
</div>
<div class="row">
<div class="col-7">Target Moisture:</div>
<input class="col-4" id="plant_${plantId}_target_moisture" type="number" min="0" max="100" placeholder="0">
</div>
<div class="row">
<div class="col-7">Pump Time (s):</div>
<input class="col-4" id="plant_${plantId}_pump_time_s" type="number" min="0" max="600" placeholder="30">
</div>
<div class="row">
<div class="col-7">Pump Cooldown (m):</div>
<input class="col-4" id="plant_${plantId}_pump_cooldown_min" type="number" min="0" max="600" placeholder="30">
</div>
<div class="row">
<div class="col-7">"Pump Hour Start":</div>
<select class="col-4" id="plant_${plantId}_pump_hour_start">10</select>
</div>
<div class="row">
<div class="col-7">"Pump Hour End":</div>
<select class="col-4" id="plant_${plantId}_pump_hour_end">19</select>
</div>
<div class="row">
<div class="col-7">Sensor B installed:</div>
<input class="col-4" id="plant_${plantId}_sensor_b" type="checkbox">
</div>
<div class="row">
<div class="col-7">Max Consecutive Pump Count:</div>
<input class="col-4" id="plant_${plantId}_max_consecutive_pump_count" type="number" min="1", max="50", placeholder="10">
</div>
Mode: <select id="plant_${plantId}_mode">
<option value="OFF">Off</option>
<option value="TargetMoisture">Target Moisture</option>
<option value="TimerOnly">Timer Only</option>
</select>
<div>
Target Moisture: <input id="plant_${plantId}_target_moisture" type="number" min="0" max="100" placeholder="0">
<br>
Pump Time (s): <input id="plant_${plantId}_pump_time_s" type="number" min="0" max="600" placeholder="30">
<br>
Pump Cooldown (m): <input id="plant_${plantId}_pump_cooldown_min" type="number" min="0" max="600" placeholder="30">
<br>
"Pump Hour Start": <select id="plant_${plantId}_pump_hour_start">10</select>
<br>
"Pump Hour End": <select id="plant_${plantId}_pump_hour_end">19</select>
<br>
Sensor B installed: <input id="plant_${plantId}_sensor_b" type="checkbox">
<br>
Max Consecutive Pump Count: <input id="plant_${plantId}_max_consecutive_pump_count" type="number" min="1", max="50", placeholder="10">
</div>

View File

@@ -135,7 +135,6 @@ export class PlantView {
this.maxConsecutivePumpCount.onchange = function(){
controller.configChanged()
}
console.log(this)
}
update(a: number, b: number) {

View File

@@ -0,0 +1,27 @@
<h3>Tank:</h3>
<div>
<input type="checkbox" id="tank_sensor_enabled">
Enable Tank Sensor
</div>
<div>
<input type="checkbox" id="tank_allow_pumping_if_sensor_error">
Allow Pumping if Sensor Error
</div>
<div>
<input type="number" min="2" max="500000" id="tank_useable_ml">
Tank Size mL
</div>
<div>
<input type="number" min="1" max="500000" id="tank_warn_percent">
Tank Warn Percent (mapped in relation to empty and full)
</div>
<div>
<input type="number" min="0" max="100" id="tank_empty_percent">
Tank Empty Percent (% max move)
</div>
<div>
<input type="number" min="0" max="100" id="tank_full_percent">
Tank Full Percent (% max move)
</div>

View File

@@ -9,6 +9,9 @@ export class TankConfigView {
private readonly tank_allow_pumping_if_sensor_error: HTMLInputElement;
constructor(controller:Controller){
(document.getElementById("tankview") as HTMLElement).innerHTML = require("./tankview.html")
this.tank_useable_ml = document.getElementById("tank_useable_ml") as HTMLInputElement;
this.tank_useable_ml.onchange = controller.configChanged
this.tank_empty_percent = document.getElementById("tank_empty_percent") as HTMLInputElement;

View File

@@ -1,7 +1,28 @@
<h2>Time</h2>
AutoRefresh:<input id="timeview_auto_refresh" type="checkbox">
<div id="timeview_esp_time">Esp time</div>
<div id="timeview_rtc_time">Rtc time</div>
<div id="timeview_browser_time">Rtc time</div>
<div></div>
<button id="timeview_time_upload">Store Browser time into esp and rtc</button>
<div class="container col-sm-6 col-md-5" style="border-style: solid; border-width: 1px; padding: 8px; margin: 8px;" >
<div class="row">
<div class="col-4">
</div>
<div class="col-4" style="text-align: center; font-weight: bold;">
Time:
</div>
<div style="display: block; right: 8px; position: absolute;">
<input id="timeview_auto_refresh" type="checkbox">
</div>
</div>
<div class="row">
<span class="col-2">MCU:</span>
<div class="col-9" id="timeview_esp_time" style="text-wrap: nowrap">Esp time</div>
</div>
<div class="row">
<span class="col-2">RTC:</span>
<div class="col-9" id="timeview_rtc_time" style="text-wrap: nowrap">Rtc time</div>
</div>
<div class="row">
<span class="col-2">Local:</span>
<div class="col-9" id="timeview_browser_time" style="text-wrap: nowrap">Local time</div>
</div>
<button id="timeview_time_upload">Store Browser time into esp and rtc</button>
</div>