Domů Procházet Nápověda
Přihlásit se
dyadmisha
/
AI-on-the-edge-device
zrcadlo https://github.com/jomjol/AI-on-the-edge-device
1
0
Rozštěpit 0
Soubory Úkoly 0 Wiki
Procházet zdrojové kódy

Update html-style

Update of HTML
jomjol před 5 roky
rodič
2159c1e1e5
revize
40953091d7
14 změnil soubory, kde provedl 323 přidání a 395 odebrání
Jednotné zobrazení Ukázat statistiku rozdílových dat
  1. 1 1
      sd-card/html/edit_alignment.html
  2. 1 1
      sd-card/html/edit_analog.html
  3. 1 1
      sd-card/html/edit_check.html
  4. 2 2
      sd-card/html/edit_config.html
  5. 0 82
      sd-card/html/edit_config_old.html
  6. 1 1
      sd-card/html/edit_digits.html
  7. 1 1
      sd-card/html/edit_reference.html
  8. 88 105
      sd-card/html/index.html
  9. 90 102
      sd-card/html/index_configure.html
  10. 1 1
      sd-card/html/ota_page.html
  11. 49 8
      sd-card/html/prevalue_set.html
  12. 7 5
      sd-card/html/reboot_page.html
  13. 1 1
      sd-card/html/upload_script.html
  14. 80 84
      sd-card/html/wasserzaehler_roi.html

+ 1 - 1
sd-card/html/edit_alignment.html
Zobrazit soubor 

@@ -5,7 +5,7 @@
 
     <title>Make Alignment</title>
 
     <title>Make Alignment</title>
 
 </head>
 
 </head>
 
 
 
-<div class="body-content">
 
+<div class="body-content" style="font-family: arial">
 
     
     
     <div id="createrefernce">
 
     <div id="createrefernce">
 
         <div style="padding-left: 30px">
 
         <div style="padding-left: 30px">

+ 1 - 1
sd-card/html/edit_analog.html
Zobrazit soubor 

@@ -5,7 +5,7 @@
 
     <title>Make Alignment</title>
 
     <title>Make Alignment</title>
 
 </head>
 
 </head>
 
 
 
-<div class="body-content">
 
+<div class="body-content" style="font-family: arial">
 
     
     
     <div id="createrefernce">
 
     <div id="createrefernce">
 
         <div style="padding-left: 30px">
 
         <div style="padding-left: 30px">

+ 1 - 1
sd-card/html/edit_check.html
Zobrazit soubor 

@@ -1,5 +1,5 @@
 
 <html>
 
 <html>
 
-<body>
 
+<body style="font-family: arial">
 
  
  
 <table>
 
 <table>
 
     <tr><td>Result:</td></tr>
 
     <tr><td>Result:</td></tr>

+ 2 - 2
sd-card/html/edit_config.html
Zobrazit soubor 

@@ -1,11 +1,11 @@
 
 <html>
 
 <html>
 
-<body>
 
+<body style="font-family: arial">
 
  
  
 <table>
 
 <table>
 
     <tr><td>Config.ini:</td></tr>
 
     <tr><td>Config.ini:</td></tr>
 
     <tr>
 
     <tr>
 
         <td colspan="3">
 
         <td colspan="3">
 
-            <textarea id="inputTextToSave" cols="80" rows="25"></textarea>
 
+            <textarea id="inputTextToSave" cols="100" rows="40"></textarea>
 
         </td>
 
         </td>
 
     </tr>
 
     </tr>
 
     <tr>
 
     <tr>

+ 0 - 82
sd-card/html/edit_config_old.html
Zobrazit soubor 

@@ -1,82 +0,0 @@
 
-<html>
 
-<body>
 
- 
-<table>
 
-    <tr><td>Config.ini:</td></tr>
 
-    <tr>
 
-        <td colspan="3">
 
-            <textarea id="inputTextToSave" cols="80" rows="25"></textarea>
 
-        </td>
 
-    </tr>
 
-    <tr>
 
-        <td><button onclick="saveTextAsFile()">Update Config.ini</button></td>
 
-    </tr>
 
-</table>
 
- 
-<script type="text/javascript">
 
-
 
-function loadConfig() {
 
-      var xhr = new XMLHttpRequest();
 
-           xhr.onload = function () {
 
-//		   alert(this.responseText);
 
-		   document.getElementById("inputTextToSave").value = this.responseText;
 
-           };
 
-	 url = '/fileserver/config/config.ini';
 
-     xhr.open('GET', url);
 
-     xhr.send();
 
-	 }
 
-
 
- 
-function saveTextAsFile()
 
-{
 
-	if (confirm("Are you sure you want to update \"config.ini\"?")) {
 
-		var xhttp = new XMLHttpRequest();
 
-		
-		/* first delete the old firmware */	
-		xhttp.onreadystatechange = function() {
 
-			if (xhttp.readyState == 4) {
 
-				if (xhttp.status == 200) {
 
-					/* keine Reaktion, damit sich das Dokument nicht ändert */
 
-				} else if (xhttp.status == 0) {
 
-					alert("Server closed the connection abruptly!");
 
-					location.reload()
 
-				} else {
 
-					alert(xhttp.status + " Error!\n" + xhttp.responseText);
 
-					location.reload()
 
-				}
 
-			}
 
-		};
 
-		xhttp.open("POST", "/delete/config/config.ini", false);
 
-		xhttp.send();
 
-		/* ----------------------------- */
 
-
 
-		var textToSave = document.getElementById("inputTextToSave").value;
 
-		
-		xhttp.onreadystatechange = function() {
 
-			if (xhttp.readyState == 4) {
 
-				if (xhttp.status == 200) {
 
-					alert("Update \"config.ini\" successfull!\n\nTo make it active you need to reboot.")
 
-					document.reload();
 
-				} else if (xhttp.status == 0) {
 
-					alert("Server closed the connection abruptly!");
 
-					location.reload()
 
-				} else {
 
-					alert(xhttp.status + " Error!\n" + xhttp.responseText);
 
-					location.reload()
 
-				}
 
-			}
 
-		};
 
-		
-		upload_path = "/upload/config/config.ini";
 
-		
-		xhttp.open("POST", upload_path, true);
 
-		xhttp.send(textToSave);
 
-	}
 
-}
 
- 
-loadConfig();
 
- 
-</script>
 
- 
-</body>
 
-</html>

+ 1 - 1
sd-card/html/edit_digits.html
Zobrazit soubor 

@@ -5,7 +5,7 @@
 
     <title>Make Alignment</title>
 
     <title>Make Alignment</title>
 
 </head>
 
 </head>
 
 
 
-<div class="body-content">
 
+<div class="body-content" style="font-family: arial">
 
     
     
     <div id="createrefernce">
 
     <div id="createrefernce">
 
         <div style="padding-left: 30px">
 
         <div style="padding-left: 30px">

+ 1 - 1
sd-card/html/edit_reference.html
Zobrazit soubor 

@@ -5,7 +5,7 @@
 
     <title>Make refernce</title>
 
     <title>Make refernce</title>
 
 </head>
 
 </head>
 
 
 
-<body>
 
+<body style="font-family: arial">
 
     <h3>Create Reference out of Raw Image</h3>
 
     <h3>Create Reference out of Raw Image</h3>
 
     <div style="padding-left: 30px">
 
     <div style="padding-left: 30px">
 
         <table>
 
         <table>

+ 88 - 105
sd-card/html/index.html
Zobrazit soubor 

@@ -1,115 +1,98 @@
 
-<html><head>
 
-	<title>jomjol - AI on the edge</title>
 
-	<meta charset="utf-8">
 
-	<meta name="viewport" content="width=device-width, initial-scale=1">
 
-	<style type="text/css" media="screen">
 
-		nav > ul {
 
-			list-style: none;
 
-			margin: 0;
 
-			padding: 0;
 
-			display: flex;
 
-			flex-direction: column;
 
-		}
 
-		
-		nav li {
 
-			margin: 0.5em;
 
-			padding: 0;
 
-			font-size: 1.5em;
 
-			flex: 1 1 0%;
 
-		}
 
-		
-		@media (min-width: 45em) {
 
-			nav > ul {
 
-				flex-direction: row;
 
-			}
 
-			nav li {
 
-				flex: 1;
 
-				font-size: 1em;
 
-			}
 
-		}
 
-		
-		nav a {
 
-			display: block;
 
-			padding: 0.4em;
 
-			text-decoration: none;
 
-			font-weight: bold;
 
-			text-align: center;
 
-			border: 1px solid darkblue;
 
-			border-radius: 10px;
 
-			box-shadow: 0 5px 10px white inset;
 
-			color: gold;
 
-			background-color: darkblue;
 
-			transition: all .25s ease-in;
 
-		}
 
-		
-		nav li[aria-current] a {
 
-			background-color: firebrick;
 
-			color: gold;
 
-		}
 
-		
-		nav a:focus,
 
-		nav a:hover,
 
-		nav li[aria-current] a:focus,
 
-		nav li[aria-current] a:hover {
 
-			color: darkblue;
 
-			background-color: gold;
 
-		}
 
-		
+<!DOCTYPE html>
 
+<html>
 
+<head>
 
+<style>
 
+.h_iframe iframe {width:995px;height:700px;}
 
+.h_iframe {width:995px;height:700px;}
 
 
 
-		html, body {
 
-			height:100%;
 
-			width:100%;
 
-			margin:0;
 
-		}
 
-		.h_iframe iframe {
 
-			width:98%;
 
-			height:80%;
 
-		}
 
-		.h_iframe {
 
-			height: 80%;
 
-			width:98%;
 
-		}
 
-	</style>
 
-	<script type="text/javascript">
 
-		//<![CDATA[
 
-		//]]>
 
+h1 {font-size: 2em;}
 
+h2 {font-size: 1.5em;}
 
+p {font-size: 1em;}
 
 
 
-	</script>
 
-</head>
 
+ul {
 
+  list-style-type: none;
 
+  margin: 0;
 
+  padding: 0;
 
+  overflow: hidden;
 
+  background-color: #333;
 
+  width:1000px;
 
+}
 
+
 
+li {
 
+  float: left;
 
+  font-family: arial;
 
+  font-size: 18px;
 
+}
 
+
 
+li a, .dropbtn {
 
+  display: inline-block;
 
+  color: white;
 
+  text-align: center;
 
+  padding: 14px 16px;
 
+  text-decoration: none;
 
+}
 
 
 
-<body>
 
-	<h1>Watermeter - AI on the edge - an ESP32 all in neural network recognition system</h1>
 
-	<nav>
 
-		<ul>
 
-			<li aria-current="page"><a href="#"onclick="document.getElementById('maincontent').src = '/wasserzaehler_roi.html';">wasserzaehler</a>	
-				<ul class="submenu">
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = '/prevalue_set.html';">Set preValue</a> </li>
 
-					<li><a href="index_configure.html">Edit Configuration</a> </li>
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = '/wasserzaehler.html?full';">/wasserzaehler.html?full</a> </li>
 
-				</ul>
 
-			</li>	
+li a:hover, .dropdown:hover .dropbtn {
 
+  background-color: red;
 
+}
 
 
 
-			<li><a href="#" onclick="document.getElementById('maincontent').src = '/fileserver/';">File Server</a> </li>					
-			 
-			<li><a href="#">System</a>
 
-				<ul class="submenu">
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = '/starttime';">Start time</a> </li>
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = '/ota_page.html';">OTA Update</a> </li>
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = '/reboot_page.html';">Reboot</a> </li>
 
-				</ul>
 
-			</li>
 
+li.dropdown {
 
+  display: inline-block;
 
+}
 
 
 
-		</ul>
 
-	</nav>
 
-	
-	<p>
 
-	
-	<div class="h_iframe">
 
-		 <iframe name="maincontent" id ="maincontent" src="/wasserzaehler_roi.html" title="fileserver" allowfullscreen></iframe> 
-	</div>
 
+.dropdown-content {
 
+  display: none;
 
+  position: absolute;
 
+  background-color: #f9f9f9;
 
+  min-width: 160px;
 
+  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 
+  z-index: 1;
 
+  font-family: arial;
 
+}
 
 
 
+.dropdown-content a {
 
+  color: black;
 
+  padding: 12px 16px;
 
+  text-decoration: none;
 
+  display: block;
 
+  text-align: left;
 
+}
 
+
 
+.dropdown-content a:hover {background-color: #f1f1f1;}
 
+
 
+.dropdown:hover .dropdown-content {
 
+  display: block;
 
+}
 
+</style>
 
+</head>
 
 
 
+<body style="font-family: arial">
 
 
 
+<h1>Watermeter - AI on the edge</h1>
 
+<h2>An ESP32 all in neural network recognition system</h2>
 
 
 
+<ul>
 
+  <li><a href="#"onclick="document.getElementById('maincontent').src = '/wasserzaehler_roi.html';">Overview</a></li>
 
+    <li class="dropdown">
 
+    <a href="javascript:void(0)" class="dropbtn">Configuration</a>
 
+    <div class="dropdown-content">
 
+      <a href="#"onclick="document.getElementById('maincontent').src = '/prevalue_set.html';">Set preValue</a>
 
+      <a href="index_configure.html">Edit Configuration</a>
 
+    </div>
 
+  </li>
 
+  <li><a href="#"onclick="document.getElementById('maincontent').src = '/wasserzaehler.html?full';">Watermeter</a></li>  
+  <li><a href="#"onclick="document.getElementById('maincontent').src = '/fileserver/';">File Server</a></li>
 
+    <li class="dropdown">
 
+    <a href="javascript:void(0)" class="dropbtn">System</a>
 
+    <div class="dropdown-content">
 
+      <a href="#"onclick="document.getElementById('maincontent').src = '/ota_page.html';">OTA Update</a>
 
+      <a href="#"onclick="document.getElementById('maincontent').src = '/reboot_page.html';">Reboot</a>
 
+    </div> 
+</ul>
 
+<p>
 
+<div class="h_iframe">
 
+	 <iframe width="1020px" height="650px" name="maincontent" id ="maincontent" src="/wasserzaehler_roi.html" title="fileserver" allowfullscreen></iframe> 
+</div>
 
 
 
-</body></html>
 
+</body>
 
+</html>

+ 90 - 102
sd-card/html/index_configure.html
Zobrazit soubor 

@@ -2,115 +2,103 @@
 
 	<title>jomjol - AI on the edge</title>
 
 	<title>jomjol - AI on the edge</title>
 
 	<meta charset="utf-8">
 
 	<meta charset="utf-8">
 
 	<meta name="viewport" content="width=device-width, initial-scale=1">
 
 	<meta name="viewport" content="width=device-width, initial-scale=1">
 
-	<style type="text/css" media="screen">
 
-		nav > ul {
 
-			list-style: none;
 
-			margin: 0;
 
-			padding: 0;
 
-			display: flex;
 
-			flex-direction: column;
 
-		}
 
-		
-		nav li {
 
-			margin: 0.5em;
 
-			padding: 0;
 
-			font-size: 1.5em;
 
-			flex: 1 1 0%;
 
-		}
 
-		
-		@media (min-width: 45em) {
 
-			nav > ul {
 
-				flex-direction: row;
 
-			}
 
-			nav li {
 
-				flex: 1;
 
-				font-size: 1em;
 
-			}
 
-		}
 
-		
-		nav a {
 
-			display: block;
 
-			padding: 0.4em;
 
-			text-decoration: none;
 
-			font-weight: bold;
 
-			text-align: center;
 
-			border: 1px solid darkblue;
 
-			border-radius: 10px;
 
-			box-shadow: 0 5px 10px white inset;
 
-			color: gold;
 
-			background-color: darkblue;
 
-			transition: all .25s ease-in;
 
-		}
 
-		
-		nav li[aria-current] a {
 
-			background-color: firebrick;
 
-			color: gold;
 
-		}
 
-		
-		nav a:focus,
 
-		nav a:hover,
 
-		nav li[aria-current] a:focus,
 
-		nav li[aria-current] a:hover {
 
-			color: darkblue;
 
-			background-color: gold;
 
-		}
 
-		
+	<style>
 
 
 
-		html, body {
 
-			height:100%;
 
-			width:100%;
 
-			margin:0;
 
-		}
 
-		.h_iframe iframe {
 
-			width:98%;
 
-			height:150%;
 
-		}
 
-		.h_iframe {
 
-			height: 150%;
 
-			width:98%;
 
-		}
 
-	</style>
 
-	<script type="text/javascript">
 
-		//<![CDATA[
 
-		//]]>
 
+	.h_iframe iframe {width:995px;height:760px;}
 
+	.h_iframe {width:995px;height:760px;}
 
 
 
-	</script>
 
-</head>
 
+	h1 {font-size: 2em;}
 
+	h2 {font-size: 1.5em;}
 
+	p {font-size: 1em;}
 
+
 
+	ul {
 
+	  list-style-type: none;
 
+	  margin: 0;
 
+	  padding: 0;
 
+	  overflow: hidden;
 
+	  background-color: #333;
 
+	  width:1000px;
 
+	}
 
+
 
+	li {
 
+	  float: left;
 
+	  font-family: arial;
 
+	  font-size: 18px;
 
+	}
 
+
 
+	li a, .dropbtn {
 
+	  display: inline-block;
 
+	  color: white;
 
+	  text-align: center;
 
+	  padding: 14px 16px;
 
+	  text-decoration: none;
 
+	}
 
 
 
-<body>
 
-	<h1>Configure watermeter</h1>
 
-	<nav>
 
-		<ul>
 
+	li a:hover, .dropdown:hover .dropbtn {
 
+	  background-color: red;
 
+	}
 
 
 
-			 
-			<li><a href="#" onclick="document.getElementById('maincontent').src = 'edit_config.html';">CONFIG.INI direct</a> </li>
 
-			<li><a href="#">Alignment</a>
 
-				<ul class="submenu">
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = 'edit_reference.html';">Reference Image</a> </li>
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = 'edit_alignment.html';">Alignment Marks</a> </li>
 
-				</ul>
 
-			</li>
 
-			<li><a href="#">Regions of interest</a>
 
-				<ul class="submenu">
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = 'edit_digits.html';">Digital ROIs</a> </li>
 
-					<li><a href="#"onclick="document.getElementById('maincontent').src = 'edit_analog.html';">Analog ROIs</a> </li>
 
-				</ul>
 
-			</li>			
+	li.dropdown {
 
+	  display: inline-block;
 
+	}
 
 
 
-			<li><a href="#" onclick="document.getElementById('maincontent').src = 'edit_check.html';">Check</a> </li>			
-			<li aria-current="page"><a href="index.html">Main</a>	
-			</li>	
-		</ul>
 
-	</nav>
 
-	
-	<p>
 
-	
-	<div class="h_iframe">
 
-		 <iframe name="maincontent" id="maincontent" src="edit_config.html" title="fileserver"></iframe> 
-	</div>
 
+	.dropdown-content {
 
+	  display: none;
 
+	  position: absolute;
 
+	  background-color: #f9f9f9;
 
+	  min-width: 160px;
 
+	  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 
+	  z-index: 1;
 
+	  font-family: arial;
 
+	}
 
 
 
+	.dropdown-content a {
 
+	  color: black;
 
+	  padding: 12px 16px;
 
+	  text-decoration: none;
 
+	  display: block;
 
+	  text-align: left;
 
+	}
 
 
 
+	.dropdown-content a:hover {background-color: #f1f1f1;}
 
+
 
+	.dropdown:hover .dropdown-content {
 
+	  display: block;
 
+	}
 
+	</style>	
+	<script type="text/javascript">
 
+		//<![CDATA[
 
+		//]]>
 
+
 
+	</script>
 
+</head>
 
 
 
+<body style="font-family: arial">
 
 
 
+<h1>Configure Watermeter</h1>
 
 
 
-</body></html>
 
+<ul>
 
+	<li aria-current="page"><a href="index.html">Main Page</a>	
+	<li><a href="#"onclick="document.getElementById('maincontent').src = 'edit_config.html';">CONFIG.INI direct</a></li>
 
+    <li class="dropdown">
 
+		<a href="javascript:void(0)" class="dropbtn">Alignment</a>
 
+		<div class="dropdown-content">
 
+			<a href="#"onclick="document.getElementById('maincontent').src = 'edit_reference.html';">Reference Image</a>
 
+			<a href="#"onclick="document.getElementById('maincontent').src = 'edit_alignment.html';">Alignment Marks</a>
 
+		</div>
 
+	</li>
 
+    <li class="dropdown">
 
+		<a href="javascript:void(0)" class="dropbtn">Regions Of Interest (ROI)</a>
 
+		<div class="dropdown-content">
 
+			<a href="#"onclick="document.getElementById('maincontent').src = 'edit_digits.html';">Digital ROIs</a>
 
+			<a href="#"onclick="document.getElementById('maincontent').src = 'edit_analog.html';">Analog ROIs</a>
 
+		</div> 
+	</li>		
+	<li><a href="#" onclick="document.getElementById('maincontent').src = 'edit_check.html';">Check</a></li>		
+</ul>
 
+<p>
 
+<div class="h_iframe">
 
+	 <iframe width="1020px" height="650px" name="maincontent" id ="maincontent" src="edit_config.html" title="fileserver"></iframe> 
+</div>
 
+</body>
 
+</html>

+ 1 - 1
sd-card/html/ota_page.html
Zobrazit soubor 

@@ -9,7 +9,7 @@
 
 	</script>
 
 	</script>
 
 </head>
 
 </head>
 
 
 
-<body>
 
+<body style="font-family: arial">
 
 <h3>It is strongly recommended to update firmware and content of /html directory on SD-card at the same time!</h3>
 
 <h3>It is strongly recommended to update firmware and content of /html directory on SD-card at the same time!</h3>
 
 <h2>1. Firmware Update</h2>
 
 <h2>1. Firmware Update</h2>
 
 <table class="fixed" border="0">
 
 <table class="fixed" border="0">

+ 49 - 8
sd-card/html/prevalue_set.html
Zobrazit soubor 

@@ -9,13 +9,50 @@
 
 	</script>
 
 	</script>
 
 </head>
 
 </head>
 
 
 
-<body>
 
-<table  style="width:100%">
 
+<style>
 
+h1 {font-size: 2em;}
 
+h2 {font-size: 1.5em;}
 
+p {font-size: 1em;}
 
+</style>
 
+
 
+<script>
 
+function includeHTML() {
 
+  var z, i, elmnt, file, xhttp;
 
+  /* Loop through a collection of all HTML elements: */
 
+  z = document.getElementsByTagName("*");
 
+  for (i = 0; i < z.length; i++) {
 
+    elmnt = z[i];
 
+    /*search for elements with a certain atrribute:*/
 
+    file = elmnt.getAttribute("w3-include-html");
 
+    if (file) {
 
+      /* Make an HTTP request using the attribute value as the file name: */
 
+      xhttp = new XMLHttpRequest();
 
+      xhttp.onreadystatechange = function() {
 
+        if (this.readyState == 4) {
 
+          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
 
+          if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
 
+          /* Remove the attribute, and call this function once more: */
 
+          elmnt.removeAttribute("w3-include-html");
 
+          includeHTML();
 
+        }
 
+      }
 
+      xhttp.open("GET", file, true);
 
+      xhttp.send();
 
+      /* Exit the function: */
 
+      return;
 
+    }
 
+  }
 
+}
 
+</script>
 
+
 
+<body style="font-family: arial">
 
+<table style="width:100%">
 
   <tr>
 
   <tr>
 
-    Current Value:<p>
 
-	<iframe name="currentvalue" id ="currentvalue" src="/setPreValue.html" title="fileserver" allowfullscreen></iframe>
 
+    <h2>Current Value:</h2><p>
 
+	<div w3-include-html="/setPreValue.html"></div>	
   </tr>	 
   </tr>	 
   <tr>
 
   <tr>
 
+  <h2>Set Value:</h2><p>
 
     Input (Format = 123.456):<p>
 
     Input (Format = 123.456):<p>
 
 	PreValue: 
 	PreValue: 
 	 <input type="number" id="myInput" name="myInput"
 
 	 <input type="number" id="myInput" name="myInput"
 
@@ -24,8 +61,8 @@
 
 	<button type="button" onclick="setprevalue()">Set PreValue</button>
 
 	<button type="button" onclick="setprevalue()">Set PreValue</button>
 
   </tr>	
   </tr>	
   <tr>
 
   <tr>
 
-    Result:<p>
 
-	<iframe name="result" id ="result" src="" title="fileserver" allowfullscreen></iframe>
 
+    <h2>Result:</h2><p>
 
+	<div id="result"> </div>
 
   </tr>	 
   </tr>	 
 
 
 </table>
 
 </table>
 
@@ -34,10 +71,14 @@
 
 function setprevalue() {
 
 function setprevalue() {
 
 	var inputVal = document.getElementById("myInput").value;
 
 	var inputVal = document.getElementById("myInput").value;
 
 	inputVal = inputVal.replace(",", ".");
 
 	inputVal = inputVal.replace(",", ".");
 
-	_value = "/setPreValue.html?value="+inputVal;
 
-	document.getElementById('result').src = _value;
 
+	_value = "<object data=" + "/setPreValue.html?value=" + inputVal + " ></object>";
 
+	document.getElementById("result").innerHTML=_value;
 
 //	location.reload();	
 //	location.reload();	
 }
 
 }
 
 </script>
 
 </script>
 
 
 
+<script>
 
+includeHTML();
 
+</script>
 
+
 
 </body></html>
 
 </body></html>

+ 7 - 5
sd-card/html/reboot_page.html
Zobrazit soubor 

@@ -9,26 +9,28 @@
 
 	</script>
 
 	</script>
 
 </head>
 
 </head>
 
 
 
-<body>
 
+<body style="font-family: arial">
 
+
 
+<h2>Do you really want to reboot your system now?</h2>
 
+
 
 <table class="fixed" border="0">
 
 <table class="fixed" border="0">
 
 	<tr>
 
 	<tr>
 
 		<td>
 
 		<td>
 
-			<button id="reboot" type="button" onclick="doReboot()">Reboot</button>
 
+			<button id="reboot" type="button" onclick="doReboot()">Yes, please reboot now</button>
 
 		</td>
 
 		</td>
 
 	</tr>
 
 	</tr>
 
 </table>
 
 </table>
 
 
 
 <script>
 
 <script>
 
 function doReboot() {
 
 function doReboot() {
 
-	if (confirm("Are you sure you want to reboot the ESP32?")) {
 
+	// if (confirm("Are you sure you want to reboot the ESP32?")) {
 
 		var stringota = "/reboot";
 
 		var stringota = "/reboot";
 
 		window.location = stringota;
 
 		window.location = stringota;
 
 		window.location.href = stringota;
 
 		window.location.href = stringota;
 
 		window.location.assign(stringota);
 
 		window.location.assign(stringota);
 
 		window.location.replace(stringota);
 
 		window.location.replace(stringota);
 
-	}
 
+	// }
 
 }
 
 }
 
 </script>
 
 </script>
 
 
 
-
 
 </body></html>
 
 </body></html>

+ 1 - 1
sd-card/html/upload_script.html
Zobrazit soubor 

@@ -1,4 +1,4 @@
 
-<table class="fixed" border="0">
 
+<table class="fixed" border="0" style="font-family: arial">
 
     <col width="300px" /><col width="200px" />
 
     <col width="300px" /><col width="200px" />
 
     <tr><td>
 
     <tr><td>
 
         <h2>ESP32 File Server</h2>
 
         <h2>ESP32 File Server</h2>

+ 80 - 84
sd-card/html/wasserzaehler_roi.html
Zobrazit soubor 

@@ -3,95 +3,91 @@
 
 	<meta charset="utf-8">
 
 	<meta charset="utf-8">
 
 	<meta name="viewport" content="width=device-width, initial-scale=1">
 
 	<meta name="viewport" content="width=device-width, initial-scale=1">
 
 	<style type="text/css" media="screen">
 
 	<style type="text/css" media="screen">
 
-		nav > ul {
 
-			list-style: none;
 
-			margin: 0;
 
-			padding: 0;
 
-			display: flex;
 
-			flex-direction: column;
 
-		}
 
-		
-		nav li {
 
-			margin: 0.5em;
 
-			padding: 0;
 
-			font-size: 1.5em;
 
-			flex: 1 1 0%;
 
-		}
 
-		
-		@media (min-width: 45em) {
 
-			nav > ul {
 
-				flex-direction: row;
 
-			}
 
-			nav li {
 
-				flex: 1;
 
-				font-size: 1em;
 
-			}
 
-		}
 
-		
-		nav a {
 
-			display: block;
 
-			padding: 0.4em;
 
-			text-decoration: none;
 
-			font-weight: bold;
 
-			text-align: center;
 
-			border: 1px solid darkblue;
 
-			border-radius: 10px;
 
-			box-shadow: 0 5px 10px white inset;
 
-			color: gold;
 
-			background-color: darkblue;
 
-			transition: all .25s ease-in;
 
-		}
 
-		
-		nav li[aria-current] a {
 
-			background-color: firebrick;
 
-			color: gold;
 
-		}
 
-		
-		nav a:focus,
 
-		nav a:hover,
 
-		nav li[aria-current] a:focus,
 
-		nav li[aria-current] a:hover {
 
-			color: darkblue;
 
-			background-color: gold;
 
-		}
 
-		
-
 
-		html, body {
 
-			height:100%;
 
-			width:100%;
 
-			margin:0;
 
-		}
 
-		.h_iframe iframe {
 
-			width:100%;
 
-			height:100%;
 
-		}
 
-		.h_iframe {
 
-			height: 100%;
 
-			width:100%;
 
-		}
 
+	.tg  {border-collapse:collapse;border-spacing:0;width:100%;color: darkslategray;border: inset;}
 
+	.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;}
 
+	.tg th{font-family:Arial, sans-serif;font-size:24px;font-weight:bold;text-align:left;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;}
 
+	.tg .tg-hfl5{font-size:20px;font-family:Arial, Helvetica, sans-serif !important;border: inset;}		
 	</style>
 
 	</style>
 
-	<script type="text/javascript">
 
-
 
-	</script>
 
 </head>
 
 </head>
 
 
 
-<body>
 
-<table  style="width:100%">
 
+<script>
 
+function includeHTML() {
 
+  var z, i, elmnt, file, xhttp;
 
+  /* Loop through a collection of all HTML elements: */
 
+  z = document.getElementsByTagName("*");
 
+  for (i = 0; i < z.length; i++) {
 
+    elmnt = z[i];
 
+    /*search for elements with a certain atrribute:*/
 
+    file = elmnt.getAttribute("w3-include-html");
 
+    if (file) {
 
+      /* Make an HTTP request using the attribute value as the file name: */
 
+      xhttp = new XMLHttpRequest();
 
+      xhttp.onreadystatechange = function() {
 
+        if (this.readyState == 4) {
 
+          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
 
+          if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
 
+          /* Remove the attribute, and call this function once more: */
 
+          elmnt.removeAttribute("w3-include-html");
 
+          includeHTML();
 
+        }
 
+      }
 
+      xhttp.open("GET", file, true);
 
+      xhttp.send();
 
+      /* Exit the function: */
 
+      return;
 
+    }
 
+  }
 
+}
 
+</script>
 
+
 
+<body style="font-family: arial">
 
+
 
+<table class="tg">
 
   <tr>
 
   <tr>
 
-    <td> <img src="/img_tmp/alg_roi.jpg" alt="ROI-Image"> </td>
 
-    <td>
 
-		<table>
 
-			<tr>
 
-				Raw Value:<p>
 
-				<iframe name="maincontent1" id ="maincontent1" src="/wasserzaehler.html?rawvalue=true" title="fileserver" allowfullscreen></iframe>
 
-			</tr>
 
-			<tr>
 
-				Corrected Value:<p>
 
-				<iframe name="maincontent2" id ="maincontent2" src="/wasserzaehler.html" title="fileserver" allowfullscreen></iframe>
 
-			</tr>
 
-		</table>
 
-	</td>
 
+    <td class="tg-hfl5" rowspan="8"><img src="/img_tmp/alg_roi.jpg" alt="ROI-Image"></td>
 
+    <th class="th">
 
+	Raw Value:
 
+	</th>
 
+  </tr>	
+  <tr>	
+    <td class="tg-hfl5">
 
+	<div w3-include-html="/wasserzaehler.html?rawvalue=true"></div>	
+	</td>	
   </tr>
 
   </tr>
 
+  <tr>
 
+    <th class="th">
 
+	Corrected Value:
 
+	</th>
 
+  </tr>	
+  <tr>	
+    <td class="tg-hfl5">
 
+	<div w3-include-html="/wasserzaehler.html"></div>	
+	</td>	
+  </tr>
 
+  <tr>
 
+    <th class="th">
 
+	Current Value:
 
+	</th>
 
+  </tr>	
+  <tr>	
+    <td class="tg-hfl5">
 
+	<div w3-include-html="/setPreValue.html"></div>	
+	</td>	
+  </tr> 
+   <tr>
 
+    <th class="th">
 
+	Start Time:
 
+	</th>
 
+  </tr>	
+  <tr>	
+    <td class="tg-hfl5">
 
+	<div w3-include-html="/starttime"></div>	
+	</td>	
+  </tr>   
 </table>
 
 </table>
 
 
 
+<script>
 
+includeHTML();
 
+</script>
 
+
 
 </body></html>
 
 </body></html>