2024-05-22 21:24:29 +02:00
<!DOCTYPE html>
< html >
< head >
< meta charset = 'UTF-8' >
< meta name = 'viewport' content = 'width=device-width, initial-scale=1.0' >
2024-12-12 02:19:04 +01:00
< title > CanGrow - Amnesia Haze< / title >
2024-05-22 21:24:29 +02:00
< link rel = 'icon' href = 'data:;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsTAAALEwEAmpwYAAABcElEQVQ4y42TzU/bQBDFf7Nx1qGuAYVgQSuo2khBggPhyIH//9AiJAQ9tEeLqCKiUD6sxF52OMSEBCdW57aa9968fTsr3V5XWVLPO6sANNL7ZRAMNeU6Ea4T1UEI6pr55kcAwhpMrYOpk2/r/yEQmKWkIonf+TZVgex4Fw0bIEtIAALF3gbZ8U5VwKa3PJ18JT9IpiLvyflBwuhLG5veVUM0/0aoCONPa2hQjWZ8uEVeupJnXSBwO8YOH8iTeAKc2Q4Xt2C1VZL93F7MjbK/bxDnp5Zn7b+So+9pdQ+K/Q5qJlrRj5Ts6DM+rK7Ih7Mr3HaM7jYQVZqXQ6Tb6yqBYdTfomhHiFfUyMI3f+01/z7RHNzTGDyWGThP63SA2d8EEfIkrgQpzmOvH0AV+3M4zegNpUwagAYG8Yp4BS0nl4Kz5Mpf0JXJMby6w/66Aa+M+9uE53/Iexsggq4ESOYWC0jmsBfX8xdXhcJjL4cLc3kBl8uJGQ/CrpAAAAAASUVORK5CYII=' >
< style >
body {
color: #cae0d0;
background-color: #1d211e;
2024-12-12 02:19:04 +01:00
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
2024-05-22 21:24:29 +02:00
}
.center {
2024-12-12 02:19:04 +01:00
width: 100%;
margin: auto;
2024-05-22 21:24:29 +02:00
}
2024-12-12 02:19:04 +01:00
.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
2024-05-22 21:24:29 +02:00
h1, h2, h3, h4, h5 {
text-align: center;
}
a:link, a:visited {
color: #04AA6D;
}
a:hover {
color: #64AA6D;
}
a:active {
color: #04AA6D;
}
.infomsg , .warnmsg {
color: #fff;
border-radius: 3px;
padding: 4px;
width: fit-content; min-width: 200px; max-width: 420px;
margin: auto;
margin-bottom: 5px;
font-weight: bold;
text-align: center;
text-decoration: none;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
}
.infomsg {
background: #04AA6D;
}
.warnmsg {
background: #aa4204;
}
.inputShort {
width: 42px;
}
2024-12-12 02:19:04 +01:00
.helpbox {
font-size: 0.8em;
margin-left: 15px;
margin-top: 5px;
margin-bottom: 5px;
}
2024-05-22 21:24:29 +02:00
.nav {
background: #333;
width: 100%;
margin: auto;
margin-bottom: 10px;
padding: 0;
position: relative;
border-radius: 3px;
}
2024-12-12 02:19:04 +01:00
.subnav {
text-align: center;
display: table;
margin: auto;
margin-bottom: 10px;
padding: 0;
position: relative;
border-radius: 3px;
}
2024-05-22 21:24:29 +02:00
.nav li {
display: inline-block;
list-style: none;
2024-12-12 02:19:04 +01:00
border-radius: 3px;
}
.subnav li {
background: #026b45;
list-style: none;
border-radius: 3px;
margin-bottom: 3px;
2024-05-22 21:24:29 +02:00
}
.nav li:first-of-type {
background: #026b45;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
2024-12-12 02:19:04 +01:00
.nav li a, .nav span, .subnav li a, .subnav span, .button, .button:link, input[type=button], input[type=submit], input[type=reset] {
2024-05-22 21:24:29 +02:00
color: #ddd;
display: block;
font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
font-size:0.8em;
padding: 10px 20px;
text-decoration: none;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
}
2024-12-12 02:19:04 +01:00
.nav li a:hover, .subnav li a:hover, .activeMenu, .button:link:hover, .button:visited:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
2024-05-22 21:24:29 +02:00
background: #04AA6D;
color: #fff;
border-radius: 3px;
}
2024-12-12 02:19:04 +01:00
.nav li a:active, .subnav li a:active {
2024-05-22 21:24:29 +02:00
background: #026b45;
color: #cae0d0;
}
.activeMenu {
background: #444;
}
.MenuTime {
background: #292929;
}
.button, .button:link, .button:visited, input[type=button], input[type=submit], input[type=reset] {
background: #026b45;
color: #fff;
border-radius: 3px;
padding: 6px 12px;
text-align: center;
text-decoration: none;
display: inline-block;
border: none;
}
.button:link:active, .button:visited:active, input[type=button]:active, input[type=submit]:active, input[type=reset]:active {
background: #026b45;
color: #cae0d0;
}
input[type=text], input[type=date], input[type=number], input[type=password], select {
background: #cae0d0;
color: #1d211e;
border: 1px solid #026b45;
border-radius: 3px;
}
2024-12-12 02:19:04 +01:00
@media only screen and (min-width: 1820px) {
2024-05-22 21:24:29 +02:00
.center, .nav {
width: 60%; min-width: 420px;
}
2024-12-12 02:19:04 +01:00
.subnav li {
display: '';
margin-bottom: 3px;
}
}
@media only screen and (min-width: 640px) {
.subnav li {
display: inline-block;
margin-bottom: 3px;
}
}
/* VPD colors */
.vpd_danger1 {
color: #1a6c9c;
}
.vpd_earlyveg {
color: #22ab9c;
}
.vpd_lateveg {
color: #9cc55b;
2024-05-22 21:24:29 +02:00
}
2024-12-12 02:19:04 +01:00
.vpd_latebloom {
color: #9cc55b;
}
.vpd_danger2 {
color: #1a6c9c;
}
2024-05-22 21:24:29 +02:00
< / style >
< / head >
< body >
2024-12-12 02:19:04 +01:00
< ul class = 'nav' > < li > < a href = '/' > 🌱 Amnesiaaaa Haze< / a > < / li >
2024-05-22 21:24:29 +02:00
< li > < a href = '/growSettings' > 🔆 Grow settings< / a > < / li >
< li > < a href = '/systemSettings' class = 'activeMenu' > ⚙ System settings< / a > < / li >
< li > < a href = '/wifiSettings' > 📡 WiFi settings< / a > < / li >
< li > < a href = '/help' > ❓ Help< / a > < / li >
2024-12-12 02:19:04 +01:00
< li > < span class = 'MenuTime' > 00:23:10< / span > < / li >
< li > < a href = 'https://git.la10cy.net/DeltaLima/CanGrow' target = '_blank' > CanGrow v0.1.3-dev< / a > < / li >
< / ul > < div class = 'center' > < h2 > ⚙ System settings< / h2 >
< ul class = 'subnav' >
< li > < a href = '/system/update' > 🔄 Firmware update< / a > < / li >
< li > < a href = '/system/restart' > 🔁 CanGrow restart< / a > < / li >
< li > < a href = '/system/wipe' > 💣 Factory reset< / a > < / li >
< / ul >
< p > here you can set which features and sensors you use< br > < / p > < form method = 'post' action = '/systemSettings/save' >
< b > Output configuration< / b > < br > Invert Outputs: < select id = 'OutputInvert' name = 'OutputInvert' required >
< option value = '0' > No< / option >
< option value = '1' selected > Yes< / option >
< / select > < br >
< p class = 'helpbox' > When using CanGrow PCB v0.6, set to < b > Yes< / b > < / p >
Use relais for LED (disable PWM): < select id = 'UseLEDrelais' name = 'UseLEDrelais' required >
< option value = '0' selected > No< / option >
< option value = '1' > Yes< / option >
< / select > < br >
Use relais for FAN1 (disable PWM): < select id = 'UseFANrelais' name = 'UseFANrelais' required >
< option value = '0' > No< / option >
< option value = '1' selected > Yes< / option >
< / select > < br > < br >
< b > Sensor configuration< / b > < br > Soilmoisture sensor: < select id = 'SelMoistureSensor_Type' name = 'MoistureSensor_Type' onchange = 'MoistureSensorType();' required >
< option value = '1' selected > Analog capacitive< / option >
< option value = '2' > I2C Chirp (0x20)< / option >
< / select > < br >
Soilmoisture dry: < input type = 'number' id = 'iSoilmoistureDry' name = 'SoilmoistureDry' min = '0' value = '360' required > < br >
Soilmoisture wet: < input type = 'number' id = 'iSoilmoistureWet' name = 'SoilmoistureWet' min = '0' value = '160' required > < br >
Soilmoisture raw reading: < i > < span id = 'iSoilmoistureRaw' > 123< / span > < / i > < input type = 'button' class = 'button' value = '🔃 Refresh' style = 'padding: 3px;' onclick = 'SoilmoistureRefresh();' >
< p class = 'helpbox' >
< b > Calibration< / b > < br >
Put your soilmoisture sensor into dry soil and hit Refresh.< br >
Adjust the value of 'Soilmoisture dry' if needed according to the reading.< br >
Repeat this with wet soil for 'Soilmoisture wet'.
< / p >
< script >
function loadJSON(callback) {
var xobj = new XMLHttpRequest();
xobj.overrideMimeType("application/json");
xobj.open('GET', '/api/sensors', true);
xobj.onreadystatechange = function() {
if (xobj.readyState == 4 & & xobj.status == "200") {
callback(xobj.responseText);
}
}
xobj.send(null);
}
function SoilmoistureRefresh() {
loadJSON(function(response) {
json = JSON.parse(response);
document.getElementById('iSoilmoistureRaw').textContent = json.soilmoistureRaw;
console.log(json.soilmoistureRaw);
});
}
function MoistureSensorType() {
let selVal = document.getElementById('SelMoistureSensor_Type').value;
let wet = document.getElementById('iSoilmoistureWet');
let dry = document.getElementById('iSoilmoistureDry');
switch(selVal) {
case '1':
wet.value = 160;
dry.value = 360;
console.log(selVal);
break;
case '2':
wet.value = 485;
dry.value = 250;
console.log(selVal);
break;
default:
wet.value = 0;
dry.value = 0;
console.log(selVal);
break;
}
}
< / script >
Temperature sensor: < select id = 'TemperatureSensor_Type' name = 'TemperatureSensor_Type' required >
< option value = '1' selected > I2C BME280 (0x76)< / option >
< option value = '2' > I2C BME280 (0x77)< / option >
< option value = '3' > I2C SHT31 (0x44)< / option >
< option value = '4' > I2C SHT31 (0x45)< / option >
< option value = '5' > I2C Chirp (0x20)< / option >
< / select > < br >
Humidity sensor: < select id = 'HumiditySensor_Type' name = 'HumiditySensor_Type' required >
< option value = '1' selected > I2C BME280 (0x76)< / option >
< option value = '2' > I2C BME280 (0x77)< / option >
< option value = '3' > I2C SHT31 (0x44)< / option >
< option value = '4' > I2C SHT31 (0x45)< / option >
< / select > < br > < br >
< b > General configuration< / b > < br > NTP offset/UTC timezone: < input class = 'inputShort' type = 'number' name = 'NtpOffset' min = '-12' max = '14' value = '1' required > Hours< br >
Maintenance Duration: < input class = 'inputShort' type = 'number' name = 'MaintenanceDuration' min = '0' max = '900' value = '300' required > Seconds< br >
PWM Frequency: < input type = 'number' name = 'PWMFrequency' min = '0' max = '20000' value = '13370' required > Hz< br >
Display rotation interval: < input class = 'inputShort' type = 'number' name = 'DisplayScreenDuration' min = '0' max = '255' value = '3' required > Seconds< br >
< p class = 'helpbox' > < b > 0< / b > will always show sensor value screen< / p > ESP32-Cam IP (optional): < input type = 'text' name = 'Esp32CamIP' maxlength = '16' value = '' > < br > < br >
< input type = 'submit' value = '💾 Save settings' >
2024-05-22 21:24:29 +02:00
< / form >
< / div >
< / body >
< / html >
