<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width" />
		<title>My static Space</title>
		<link rel="stylesheet" href="https://huggingface.co/spaces/vk-ai-system/flask_inference_api/resolve/main/style.css" />
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>




      
	</head>
<body>
  <h1>Zapro</h1>
  <p>PH значение: <span id="ph_value">{{ ph }}</span></p>
  <p>EC значение: <span id="ec_value">{{ ec }}</span></p>


  <script>
    $(document).ready(function() {
      function updateValues(phValue, ecValue) {
        $("#ph_value").text(phValue);
        $("#ec_value").text(ecValue);
      }

      function fetchValues() {
        $.ajax({
          url: "/zapro",
          method: "GET",
          dataType: "json",
          success: function(response) {
            updateValues(response.ph, response.ec);
          }
        });
      }

      fetchValues();
      setInterval(fetchValues, 10000);
    });
  </script>
      
</body>
</html>