playground

This commit is contained in:
Marcus 2025-01-21 22:10:12 +01:00
parent debb350411
commit 806de10a6e
3 changed files with 454 additions and 0 deletions
playground/html/growAir

View file

@ -0,0 +1,236 @@
body {
color: #cae0d0;
background-color: #1d211e;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
text-align: center;
}
.footer {
color: #343B35;
}
.center {
/*width: 100; */
margin: auto;
}
.centered {
margin-left: auto;
margin-right: auto;
}
h1 {
margin: 15px;
}
h2 {
margin: 10px;
}
h3 {
margin: 5px;
}
td {
text-align: left;
vertical-align: middle;
border-bottom: 1px solid #262B27;
}
hr {
height: 1px;
border-width: 0;
color: #262B27;
background-color: #262B27;
margin-top: 0.5em;
margin-bottom: 0.5em;
margin-left: auto;
margin-right: auto;
border-style: inset;
width: 320px;
}
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;*/
display: inline-block;
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;
}
.helpbox {
font-size: 0.8em;
margin-left: 15px;
margin-top: 5px;
margin-bottom: 5px;
}
.nav {
background: #333;
/*width: 100; */
margin: auto;
margin-bottom: 10px;
padding: 0;
position: relative;
border-radius: 3px;
display: inline-block;
text-align: left;
}
.subnav {
/*text-align: center;*/
margin: auto;
margin-bottom: 10px;
padding: 0;
position: relative;
border-radius: 3px;
}
.subnavTitle {
font-size: 1em;
/*font-weight: bold;*/
margin-top: -10px;
margin-bottom: 10px;
/*text-align: center;*/
}
.nav li {
display: inline-block;
list-style: none;
border-radius: 3px;
}
.subnav li {
background: #262B27;
list-style: none;
border-radius: 3px;
margin-bottom: 3px;
display: inline-block;
}
.nav li:first-of-type {
background: #026b45;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.nav li a, .nav span, .subnav li a, .subnav span, .button, .button:link, input[type=button], input[type=submit],
input[type=reset], .linkForm input[type=submit] {
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);
}
.subnav li a, .subnav span {
padding: 5px 10px;
}
.nav li a:hover, .subnav li a:hover, .activeNav, .button:link:hover, .button:visited:hover, input[type=button]:hover,
input[type=submit]:hover, input[type=reset]:hover, .linkForm input[type=submit]:hover {
background: #04AA6D;
color: #fff;
border-radius: 3px;
}
.nav li a:active, .subnav li a:active {
background: #026b45;
color: #cae0d0;
}
.activeNav {
background: #444;
}
.navTime {
background: #292929;
}
.button, .button:link, .button:visited, input[type=button], input[type=submit],input[type=reset],
.linkForm input[type=submit] {
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, .linkForm input[type=submit]: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;
}
.linkForm {
display: inline-block;
}
.linkForm input[type=submit] {
background: #262B27;
padding: 5px;
}
.hidden {
display: none;
}
.force_hide {
display: none !important;
}
.visible {
display: inline;
/*justify-content: center!important;*/
}
/* a disabled class */
a.disabled {
pointer-events: none;
}
@media only screen and (min-width: 1820px) {
/*.center, .nav {
width: 60; min-width: 420px;
}*/
.subnav li {
display: '';
margin-bottom: 3px;
}
}
/*@media only screen and (min-width: 640px) {
}*/

View file

@ -0,0 +1,179 @@
function toggleDisplay(id) {
let el = document.getElementById(id);
let el_cs = getComputedStyle(el);
if (el_cs.getPropertyValue('display') === 'none') {
el.style.display = 'inline';
} else {
el.style.display = 'none';
}
}
function hideAllClass(classname) {
const el = document.getElementsByClassName(classname);
for(let i = 0; i < el.length ; i++) {
el[i].style.display = 'none';
}
}
function showSelect(selectId, prefix, hideClass = '') {
if(hideClass != '') {
hideAllClass(hideClass);
}
let selVal = document.getElementById(selectId).value;
toggleId = prefix + selVal;
if(document.getElementById(toggleId) !== null ) {
toggleDisplay(toggleId);
}
}
function confirmDelete(name) {
return confirm('Delete ' + name + '?');
}
function SystemOutputAddselectRequired(selectId) {
let selVal = document.getElementById(selectId).value;
//hideAllClass('hidden');
console.log('selectReq Status: ' + selVal);
switch(selVal) {
case '1':
document.getElementById('gpio').required = true;
document.getElementById('gpio_pwm').required = true;
document.getElementById('i2c_type').required = false;
document.getElementById('i2c_addr').required = false;
document.getElementById('i2c_port').required = false;
document.getElementById('webcall_host').required = false;
document.getElementById('webcall_path_on').required = false;
document.getElementById('webcall_path_off').required = false;
break;
case '2':
document.getElementById('gpio').required = false;
document.getElementById('gpio_pwm').required = false;
document.getElementById('i2c_type').required = true;
document.getElementById('i2c_addr').required = true;
document.getElementById('i2c_port').required = true;
document.getElementById('webcall_host').required = false;
document.getElementById('webcall_path_on').required = false;
document.getElementById('webcall_path_off').required = false;
break;
case '3':
document.getElementById('gpio').required = false;
document.getElementById('gpio_pwm').required = false;
document.getElementById('i2c_type').required = false;
document.getElementById('i2c_addr').required = false;
document.getElementById('i2c_port').required = false;
document.getElementById('webcall_host').required = true;
document.getElementById('webcall_path_on').required = true;
document.getElementById('webcall_path_off').required = true;
break;
default:
break;
}
}
// https://stackoverflow.com/a/67412019
function SystemOutputAdd_replaceI2cAddr(selectId, replaceId) {
let sel = document.querySelector('#' + replaceId);
let selVal = document.getElementById(selectId).value;
// Remove existing options
Array.from(sel).forEach((option) => {
sel.removeChild(option)
});
// get or set your new options here.
if(selVal) {
addr[selVal].map((optionData) => {
let opt = document.createElement('option');
let PortsUsed = 0;
let label = optionData[0];
opt.value = optionData[1];
// iterate through i2c modules available ports
for(i = 0; i < optionData[2].length; i++) {
if(optionData[2][i] > 0) {
PortsUsed++;
}
}
if(PortsUsed >= optionData[2].length) {
opt.disabled = true;
label = label + ' (used)';
}
opt.appendChild(document.createTextNode(label));
sel.appendChild(opt);
});
SystemOutputAdd_replaceI2cPort('i2c_type', 'i2c_addr', 'i2c_port');
}
}
//////////////////////////////////////
function SystemOutputAdd_replaceI2cPort(selectTypeId, selectAddrId, replaceId) {
let repl = document.querySelector('#' + replaceId);
let selValType = document.getElementById(selectTypeId).value;
let selValAddr = document.getElementById(selectAddrId).value;
// Remove existing options
Array.from(repl).forEach((option) => {
repl.removeChild(option)
});
if(selValAddr) {
console.log('true');
// iterate through i2c modules available ports
for(i = 0; i < addr[selValType][selValAddr][2].length; i++) {
let opt = document.createElement('option');
let label = 'Port ' + i;
opt.value = i;
if(addr[selValType][selValAddr][2][i] > 0) {
label = label + ' (used)';
opt.disabled = true;
}
opt.appendChild(document.createTextNode(label));
repl.appendChild(opt);
console.log('PortID ' + i + ' Port sum ' + addr[selValType][selValAddr][2].length);
}
} else {
let opt = document.createElement('option');
opt.appendChild(document.createTextNode('n/a'));
opt.disabled = true;
repl.appendChild(opt);
}
}
//javascript is my passion
function SystemSensorAddGpioI2cSel(selectId) {
let selVal = document.getElementById(selectId).value;
hideAllClass('hidden');
if(selVal == 1) {
document.getElementById('type_1').style.display = 'inline';
document.getElementById('i2c_addr').required = false;
if(ESP == '32') {
document.getElementById('gpio').required = true;
}
} else if(selVal > 1) {
document.getElementById('type_2').style.display = 'inline';
document.getElementById('i2c_addr').required = true;
if(ESP == '32') {
document.getElementById('gpio').required = false;
}
}
}
function convertDateToEpoch(src, dst) {
var val = document.getElementById(src).value ;
document.getElementById(dst).value = new Date(val).getTime() / 1000;
}
function GrowAirSelectControlSensorRead(selectId, inputSensor, inputRead) {
let selVal = document.getElementById(selectId).value;
let sensor = selVal.split(';')[0];
let read = selVal.split(';')[1];
document.getElementById(inputSensor).value = sensor;
document.getElementById(inputRead).value = read;
}

View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>CanGrow - CanGrow v0.2-dev</title>
<link rel='stylesheet' href='cangrow.css'>
<script type='text/javascript' src='cangrow.js'></script>
</head>
<body>
<ul class='nav'><li><a href='/'>&#x1F331; CanGrow</a></li>
<li><a class='activeNav' href='/grow/' >&#128262; Grow settings</a></li>
<li><a class='' href='/system/' >&#9881; System settings</a></li>
<li><a class='' href='/wifi/' >&#128225; WiFi settings</a></li>
<li><a class='' href='/help' >&#x2753; Help</a></li>
<li><span class='navTime'>22:04:07</span></li>
<li><a href='https://git.la10cy.net/DeltaLima/CanGrow' target='_blank'>CanGrow v0.2-dev</a></li>
</ul>
<div class='center'>
<ul class='subnav'>
<li><a class='' href='/grow/'>&#x1F6E0;&#xFE0F; General</a></li>
<li><a class='' href='/grow/light/'>&#x1F4A1; Light</a></li>
<li><a class='activeNav' href='/grow/air/'>&#x1F300; Air</a></li>
<li><a class='' href='/grow/water/'>&#x1F4A7; Water</a></li>
<li><a class='' href='/grow/dashboard/' >&#x1F5A5;&#xFE0F; Dashboard</a></li>
</ul>
<p>here you can set air stuff<br></p>
<form method='post' action='/grow/air/'><input type='hidden' name='output' value='1' required><h2>PWM Fan</h2><u>Type:</u><br><b>GPIO</b><br><u>Speed</u><br><input type='range' name='speed' min='0' max='100' value='67'/> &#37;<br><input type='hidden' name='controlSensor' value='1' id='controlSensor1'><input type='hidden' name='controlRead' value='1' id='controlRead1'><u>Controled by</u><br><select name='controlBy' id='ctrl1'onChange="GrowAirSelectControlSensorRead('ctrl1', 'controlSensor1', 'controlRead1');"><option value='' selected hidden>---</option><option value='0;0'>Fühler innen - Temperature (28.97 °C)</option><option value='0;1'>Fühler innen - Humidity (33.78 &#37;)</option><option value='0;4'>Fühler innen - Gas resistance (225.49 KOhm)</option><option value='1;0'>SHT31 - Temperature (23.81 °C)</option><option value='1;1' selected>SHT31 - Humidity (40.48 &#37;)</option><option value='4;1'>Chirp - Temperature (0.00 °C)</option></select><br><u>Control mode</u><br><select name='controlMode' required><option value='1' selected>Yes</option><option value='0'>No</option>'/> &#37;</select><br><u>Min</u><br><input class='inputShort' type='number' name='min' min='0' max='255' value='1' required><br><u>Max</u><br><input class='inputShort' type='number' name='max' min='0' max='255' value='2' required><br><input type='submit' value='&#x1F4BE; Save settings' style='margin-top: 8px;'></form><hr>
<div class='footer'><span>Build: debb350-esp8266:d1_mini_clone-20250121220238</span></div></div></body></html>