<?php 

    //include("components/check.php");
?>
<!--
 =========================================================
* Black Dashboard PRO - v1.1.1
=========================================================

* Product Page: https://themes.getbootstrap.com/product/black-dashboard-pro-premium-bootstrap-4-admin/
* Copyright 2019 Creative Tim (https://www.creative-tim.com)

* Coded by Creative Tim

=========================================================

* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-->


<!DOCTYPE html>
<html lang="en">
<head>
   <script src="fili.js"></script>
   <script src="d3draw.js"></script>
<?php

$path = $_SERVER['DOCUMENT_ROOT'];
$path .= "/components/header.php";
include_once($path);

?>
<script>
	var addrs = "wss://rbf.nanodesign.sk:" + 18892 + "/websocket/";
	var ekg_socket = new SocketWrapper( addrs );
	var global_socket_wrapper = ekg_socket;
	
    google.charts.load('current', {'packages':['timeline']});
    google.charts.setOnLoadCallback(drawChart);
    function drawChart( name, interval_start, interval_length ) {
		return;
		  $( "#example3.1" ).empty();
		  var datas = [];

		  datas.append( ['Activity', 'Start Time', 'End Time'] );

		  for( var x = 0; x <arr.length; x++ ) {
		      
		        var l = [name,
		         			new Date(interval_start),
		         			new Date(interval_start + interval_length)];
			    datas.append( l );
		  }

	    }
    	var breath_graph = 0;
    	var ekg_graph = 0;
    	var offset = 0;
    	function createNewGraph( data ) {
    		console.log( data );
    		data = data;
    		
        	ekg_graph.clears();
        	breath_graph.clears();
			
        	data = data.reverse(); 
        	
			var old_time = 0;
			var filt_ekg = 0;
			var filt_breath = 0;
			var ghg = 0;
			for( var x = 0; x < data.length; x++) {
				offset = 0;
				for( var y = 0; y < data[x][1].length; y++) {

					filt_ekg += data[x][1][ y ];
					filt_breath += data[x][2][ y ];
					ghg++;
				}
			}
			
			filt_ekg = Math.abs( filt_ekg / ghg );
			filt_breath = Math.abs(  filt_breath / ghg );
			filt_breath1 = (  filt_breath / ghg );
			
			
			console.log( filt_ekg );
			console.log( filt_breath );
			
			var ekg_sig = [];
			var breath_sig = [];
			var kernel_ekg = [];
			var kernel_breath = [];
			
			
			for( var x = 0; x < data.length-1; x++) {
				
				for( var y = 0; y < data[x][1].length; y++) {
					ekg_sig.push( data[x][1][ y ] );
					breath_sig.push( data[x][2][ y ] );
				}
			}
			var ekg_sig_filt = math_filter_median( ekg_sig, 3 );
			var breath_sig_filt = math_filter_median( breath_sig, 3 );
			console.log( ekg_sig_filt );
			for( var x = 0; x < breath_sig.length-1; x++) {
				
				ekg_graph.pushData( (offset)+data[0][0]*1000, ekg_sig_filt[ x ] );
				breath_graph.pushData( (offset)+data[0][0]*1000, breath_sig_filt[ x ] );
				
				offset += 4;
			}
			
			ekg_graph.displayData();
			breath_graph.displayData();
			
    	}
    	
		function createGraphTable( data ) {
			var dataset = [data];

			var options = {
					id_div_container: "visavail_container",
					id_div_graph: "visavail_graph",
					
					icon: {
						class_has_data: 'fas fa-fw fa-check',
						class_has_no_data: 'fas fa-fw fa-exclamation-circle'
					},
					zoom:{
						enabled:true,
					},
					responsive:{
						enabled:true,
					},
					tooltip: {
						date_plus_time: true
					},
					date_in_utc: true,
				};
				
			var chart = visavail.generate(options, dataset)
		}
		
		function liveUpdate() {

			this.handleLive = function( data ) {
				
				pushNewRow( data, RowMagCradleMain );
			}

		}
		function liveUpdate1() {

			this.handleLive = function( data ) {
			}

		}
		var datasource = 0;
		var data_table = 0;
		var global_tables = {};

		function ref() {
			var queryString = window.location.search;
			var urlParams = new URLSearchParams(queryString);
			var dev_id = urlParams.get('dev_id')
			
			createNewCommands1( "task", { "task_name": "GetData", "params": {"query": " Select time, \"measEKG\", \"measBreath\" from public.\"MeasurementEKG\" Where \"ekgId\" = " + dev_id + " and time > (Select MAX( time ) from public.\"MeasurementEKG\" Where \"ekgId\" = " + dev_id + " ) - 20 ORDER BY \"packetId\" DESC LIMIT 1000" } }, createNewGraph, ekg_socket ); 

		}
		
		function start() {

			var ff = new liveUpdate();
			var ff1 = new liveUpdate1();

			global_socket_wrapper.init();
			setInterval( ref, 3000 );
			ref();
	    	ekg_graph = new Graph( "graph_container", "ADC raw value" );
	    	breath_graph = new Graph( "graph_container1", "ADC raw value" );

			
		}

		
	
</script>		
</head>

<body class="sidebar-mini" onload="start()" >
  <div class="wrapper">
    <div class="navbar-minimize-fixed">
      <button class="minimize-sidebar btn btn-link btn-just-icon">
        <i class="tim-icons icon-align-center visible-on-sidebar-regular text-muted"></i>
        <i class="tim-icons icon-bullet-list-67 visible-on-sidebar-mini text-muted"></i>
      </button>
    </div>
    <?php
    
    $path = $_SERVER['DOCUMENT_ROOT'];
    $path .= "/components/sidebar.php";
    include_once($path);
    
    ?>
    <div class="main-panel">
      <!-- Navbar -->
        <?php
        
        $path = $_SERVER['DOCUMENT_ROOT'];
        $path .= "/components/plugin.php";
        include_once($path);
        
        ?>
        <?php
        
        $path = $_SERVER['DOCUMENT_ROOT'];
        $path .= "/components/navbar.php";
        include_once($path);
        
        ?>
     	
      <!-- End Navbar -->
      <div class="content">
        <div class="col-md-8 ml-auto mr-auto">
          <h4 class="text-center">Informácie o zariadení</h4>
          <p class="text-center">Podrobné informácie o stave a fungovaní zariadenia. Plná dokumentácia ku zariadeniu je na stránke 
            <a href="https://datatables.net/" target="_blank">dokumentácia.</a>
          </p>
        </div>

        <div class="row mt-5">
          <div class="col-md-12">
            <div class="card">
              <div class="card-body">
                <div class="toolbar">
                  <!--        Here you can write extra buttons/actions for the toolbar              -->
                </div>
                <h4 class="text-left">EKG</h4>
                <div style="width: 100%;height: 600px;" class="visavail" id="graph_container" class="chartjs-render-monitor">
    				
    				
    			</div>
			
              </div>
              <!-- end content-->
            </div>
            <!--  end card  -->
          </div>
          <!-- end col-md-12 -->
        </div>
        <div class="row mt-5">
          <div class="col-md-12">
            <div class="card">
              <div class="card-body">
                <div class="toolbar">
                  <!--        Here you can write extra buttons/actions for the toolbar              -->
                </div>
                <h4 class="text-left">Breath</h4>
                <div style="width: 100%;height: 600px;" class="visavail" id="graph_container1" class="chartjs-render-monitor">
    				
    				
    			</div>
			
              </div>
              <!-- end content-->
            </div>
            <!--  end card  -->
          </div>
          <!-- end col-md-12 -->
        </div>

        <!-- end row -->
      </div>
      </div>
		
	    <?php
    
    $path = $_SERVER['DOCUMENT_ROOT'];
    $path .= "/components/footer.php";
    include_once($path);
    
    ?>
	
    </div>
  </div>
  <!--   Core JS Files   -->
    <?php
    
    $path = $_SERVER['DOCUMENT_ROOT'];
    $path .= "/components/code_footer.php";
    include_once($path);
    
    ?>
</body>

</html>
