<?php
session_start();
$path = $_SERVER['DOCUMENT_ROOT'];
$path .= "/components/check.php";
include_once($path);

?>
<!--
 =========================================================
* 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>

<?php

$path = $_SERVER['DOCUMENT_ROOT'];
$path .= "/components/header.php";
include_once($path);

?>
<style>
	.item-elem {
	   width: 100px;
	   display: inline-block;
	}
	.val-elem {
	   width: 60px;
	   display: inline-block;
	   
	}
	.val-elem-special {
	   width: 150px;
	   display: inline-block;
	   
	}
	.row-elem {
		height: 25px;
	}
    .left{ display:inline-block;width:40%;color: rgba(255, 255, 255, 0.8);padding-top:3px; }
    .right{ margin-left:17px;display:inline-block;width:33%;height:20px;color: rgba(255, 255, 255, 0.8);padding-top:3px; }
    .center{ display:inline-block;width:15%;color: rgba(255, 255, 255, 0.8);text-align:center;padding-top:5px; }
    
	.center-special {
		 display:inline-block;width:55%;color: rgba(255, 255, 255, 0.8);text-align:center;padding-top:5px;
	}
    .ps> .ps__scrollbar-x-rail, .ps> .ps__scrollbar-y-rail{
	   
	    opacity: 0.6;
	}
	.momentum-scroll {
		   -webkit-overflow-scrolling: touch; /* Lets it scroll lazy */
	}
.scroll-pane
{
    width: 100%;
    height: 200px;
    overflow: auto;
}
.scroll-pane p
{
    margin: 5px 0;
}

 .navbar-collapse::-webkit-scrollbar {
    width: 20px;
}
.navbar-collapse::-webkit-scrollbar-track {
    background-color: lightgray;
}
.navbar-collapse::-webkit-scrollbar-thumb {
    background-color: lightblue;
}
</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" type="text/javascript"></script>
			

<script>
	var graphs_lines = {};
	var id_graphs = 0;
	var t_env_sensor = [];
	var MAX_GRAPH_SIZE = 0;
	var global_init = 0;
	function createLine( id, datas, name, color ) {
		var labels1 = [];
		for( var x = 0; x < 200; x++ ) {
			labels1.push( "" );
		}
		MAX_GRAPH_SIZE = labels1.length;
		//
		

    const custom_canvas_background_color = {
      id: 'custom_canvas_background_color',
      beforeDraw: (chart, args, options) => {
        const {
          ctx,
          chartArea: { top, right, bottom, left, width, height },
          scales: { x, y },
        } = chart;
        ctx.save();
        ctx.globalCompositeOperation = 'destination-over';
        ctx.fillStyle = '#E5E5E5';
        ctx.fillRect(left, top, width, height);
        ctx.restore();
      },
    };
    	var data = {
    			labels : labels1,
    			datasets : [
    				{
    			        fill: false,
    			        label: 'Signal',
    			        fill: false,
    			        borderColor: color,
    					data : datas
    				}
    			]
    		}
    	  var ctx = document.getElementById(id).getContext("2d");
    
    	  var f =  new Chart(ctx , {
    		    type: "line",
    	  	scaleOverlay : false,
    	  	scaleOverride : false,	
    	  	scaleSteps : 1,
    	  	scaleStepWidth : 1,
    	  	scaleStartValue : 0,
    		data: data,
    	  	scaleLineWidth : 1,
    	  	 plugins: [custom_canvas_background_color],
    	  	scaleShowLabels : false,
    	  	scaleLabel : "<%=value%>",
    	  	scaleFontFamily : "'Lato'",	
    	  	scaleFontSize : 12,	
    	  	scaleFontStyle : "800",
    	  	scaleFontColor : "rgba(0,0,0,0)",	
    
    	  	scaleShowGridLines : false,
    	  	responsive: true,
    	  	scaleGridLineColor : "rgba(0,0,0,0)",
    	  	scaleGridLineWidth : 1,	
    
    	  	bezierCurve : true,
    
    	  	pointDot : false,
    	  	pointDotRadius : 5,
    	  	pointDotStrokeWidth : 1,
    
    	  	datasetStroke : false,
    	  	datasetStrokeWidth : 1,
    	  	datasetFill : false,
    
    	  	animation : true,
    	  	animationEasing : "easeOutQuart",
    	  	onAnimationComplete : null,
    	  	scaleShowLabels : false,
    	    options: {
    	        scales:
    	        {
    	            yAxes: [{
    	                display: false,
    	                gridLines: {
    	                    display: true,
    	                    drawBorder: false,
    	                }
    	               
    	            }],
    	            xAxes: [{
    	            	 display: false,
    	                ticks: {
    	                    fontColor:['green','red','blue','yellow','green','red'],
    	                    callback: function(value, index, values) {
    	                    if(index === 3) {
    	                      return '**'+value+'**';
    	                    } 
    	                    else {
    	                        return value;
    	                        }
    	                    }
    	                },
    	            }]
    	        }, 
    				legend: {
    					display: false
    				},
                    elements: {
                        point:{
                            radius: 0
                        }
                    },
                    chartArea: {
                        backgroundColor: 'rgba(0,0,0,0)'
                    }
    				
    	    }
    
    
    	  });
    	  graphs_lines[ id ] = f;
	  
	}

    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 );
		  }

	    }

        function saveDone() {
        	showInfoMsg( "Teplota uložená", 2);
        	        	
        }
	
		function sendData( id ) {
			var dats = $("#manual-temp-" + id).val();
						
			if ( dats.indexOf( "," ) != -1 ) {
				dats = dats.replace( ".", "," );
			}
			var timestamp = Date.now()/1000;
			createNewCommands( "task", { "task_name": "GetData", "params": {"query": "INSERT INTO public.\"TestCoin\"( \"val\", \"timestamp\", \"type\", \"coin_id\"    ) VALUES( '" + dats + "', "+ timestamp +", 0, " + id + " )" } }, saveDone );
			showInfoMsg( "Ukladá sa teplota...", 2);
        	 
		}
	
		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)
		}
		var time = 0;
		var time_c = 0;
		
		var animation_array = [];
		
		function animationStep() {
			if ( animation_array.length != 0 ) {
				var t = 0;
				if ( animation_array.length < 20 ) {
					t = 1;
				}else if(animation_array.length > 100){
					t = 5;
				}else{
					t = 2;
				}
				
				for ( var x= 0; x < t; x++ ) {
					
					var data  = animation_array.shift();
					
					var char = graphs_lines[ "r1-line-" + data[ "coin_id" ] ];
    				addData( char, data["z"] );
    				
    				char = graphs_lines[ "r-line-" + data[ "coin_id" ] ];
    				//console.log( char ); 
    				addData1( char, data["r_led"], data["r_led_1"] );
    				
    				char = graphs_lines[ "g-line-" + data[ "coin_id" ] ];
    				addData1( char, data["g_led"], data["g_led_1"] );
    				
    				char = graphs_lines[ "g1-line-" + data[ "coin_id" ] ];
    				addData( char, data["x"]  );
    				
    				char = graphs_lines[ "ir-line-" + data[ "coin_id" ] ];
    				addData1( char, data["ir_led"], data["ir_led_1"] );
    				
    				char = graphs_lines[ "ir1-line-" + data[ "coin_id" ] ];
    				var c = addData( char, data["y"] );
    				
    				time_c += c;
    				if ( data["time"] - time > 1 ) {
    					//console.log( "Average sample rate is " + ( time_c / ( data["time"] - time ) ) );
    					$("#sample-r-"+ data[ "coin_id" ]).html( ( time_c / ( data["time"] - time )  ));
    					time_c = 0;
    					time = data["time"];
    					
    				
    				}
    				$("#bc-snr-"+ data[ "coin_id" ]).html(  data["snr"] );
    				$("#cb-snr-"+ data[ "coin_id" ]).html( data["response_snr"][0] );
    				$("#buffer-"+ data[ "coin_id" ]).html( data["buffer_size"][0] );
    				
					
				}
			}
		}
		
		function liveUpdate() {

			this.handleLive = function( data ) {
				if ( global_init == 0 )
					return 0;
			
				console.log( data );  
				if ( data["avg_time"] != 0 ) {
				}
    
				animation_array.push( data );
				
			}

		}
		function liveUpdate1() {

			this.handleLive = function( data ) {
			}

		}
		var focused = true;

	    
    	window.onfocus = function() {
    		if ( focused == false ) {
    			clearInterval( global_socket_wrapper.interval );
    			global_socket_wrapper.interval = setInterval( global_socket_wrapper.step, 20 );
    		}
    	    focused = true;
    	};
    	window.onblur = function() {

    		if ( focused == true ) {
    			clearInterval( global_socket_wrapper.interval );
    			global_socket_wrapper.interval = setInterval( global_socket_wrapper.step, 2000 );
    		}

    		focused = false;
        	
    	};
		setInterval( check, 100 );
        var page_vis = true;
        function check() {
        	if ( document.hidden == true && page_vis == true ) {
        		clearInterval( global_socket_wrapper.interval );
        		clearTimeout( ff );
        		page_vis = false;
        	}
        	if ( document.hidden == false && page_vis == false  ) {
        		//updateCoinTable();
        		global_socket_wrapper.interval = setInterval( global_socket_wrapper.step, 20 );
        		page_vis = true;
        	}
        	
			
        }
		
		var datasource = 0;
		var data_table = 0;
		var global_tables = {};
		var id_settings_table = {};
		
		function createNewTableDataSet( data ) {
			var d =	( data );
			global_tables[ "global_main_table" ].processData( d["result"] );
			for (const x of d["result"] ) {
				id_settings_table[ x[ 0 ] ] = x[ 11 ]; 
					
			}

			try{
				$("#loaderf").hide();
			}catch(err){
				
			}
		}
		var ff;
        	
        	
        function createDashboard( data ) {
			var coin_ids = {};
			
        	for( var x = 0; x < data["result"].length; x++ ) {
        		//console.log( data );
				var type = data["result"][ x ][ 2 ];
				
				if ( type == 1 ) {
    				createElement([key, "N/O"], coin_ids[ key ]["temp"], coin_ids[ key ]["acc"], coin_ids[ key ]["rot"], [90.8, 90.7, 90.5, 90.4, 90.3, 90.1, 90.1, 90.8, 90.8, 90.8, 90.8, 92.1 ], [ 89, 88, 87, 86, 85, 90, 95, 87, 74, 80 ], [ 19.1, 17.3, 17.5, 19.1, 17.3, 17.5, 19.1, 17.3, 17.5, 15 ], curr_time - coin_ids[ key ]["time"], coin_ids[ key ]["snr"].reverse(), coin_ids[ key ]["bat"].reverse(), coin_ids[ key ]["time"], coin_ids[ key ]["bts_id"].reverse()  );
    			}else if ( type == 2 ) { 	
    				createElementCoin2([ data["result"][ x ][ 3 ], "N/O"], data["result"][ x ][ 10 ], data["result"][ x ][ 4 ], data["result"][ x ][ 11 ],data["result"][ x ][ 4 ], data["result"][ x ][ 14 ], data["result"][ x ][ 15 ], data["result"][ x ][ 16 ], data["result"][ x ][ 17 ], data["result"][ x ][ 18 ], data["result"][ x ][ 19 ], curr_time - data["result"][ x ][ 0 ], data["result"][ x ][ 6 ] , data["result"][ x ][ 5 ], data["result"][ x ][ 0 ], data["result"][ x ][ 24 ]  );
    			}else if ( type == 0 ) { 	
    				createElementCoin2([ data["result"][ x ][ 3 ], "N/O"], data["result"][ x ][ 10 ], data["result"][ x ][ 4 ], data["result"][ x ][ 11 ],data["result"][ x ][ 4 ], data["result"][ x ][ 14 ], data["result"][ x ][ 15 ], data["result"][ x ][ 16 ], data["result"][ x ][ 17 ], data["result"][ x ][ 18 ], data["result"][ x ][ 19 ], curr_time - data["result"][ x ][ 0 ], data["result"][ x ][ 6 ] , data["result"][ x ][ 5 ], data["result"][ x ][ 0 ], data["result"][ x ][ 24 ]  );
    			}else if ( type == 3 ) { 	
    				createElementCoin3([ data["result"][ x ][ 3 ], "N/O"], data["result"][ x ][ 10 ], data["result"][ x ][ 4 ], data["result"][ x ][ 11 ],data["result"][ x ][ 4 ], data["result"][ x ][ 14 ], data["result"][ x ][ 15 ], data["result"][ x ][ 16 ], data["result"][ x ][ 17 ], data["result"][ x ][ 18 ], data["result"][ x ][ 19 ], curr_time - data["result"][ x ][ 0 ], data["result"][ x ][ 6 ] , data["result"][ x ][ 5 ], data["result"][ x ][ 0 ], data["result"][ x ][ 24 ]  );
    			}
        	}	

	
        	global_init = 1;
        	var curr_time = Date.now()/1000;
        	coin_int = {};
        	

        	
        }
        
       	function requestCoinNameIdTable() {
			
			createNewCommands( "task", { "task_name": "GetData", "params": {"query": 'SELECT id, name FROM public."Coins"' } }, processCoinNameIdTable ); 
       	}
       	
		var coin_table = {};
       	function processCoinNameIdTable( data ) {
			data = data["result"];
			for( var x = 0; x < data.length; x++ ) {
				var name = data [ x ][ 1 ];
				if ( data [ x ][ 1 ] == null ) {
					name = "N/O";
				}  
				
				coin_table[ data [ x ][ 0 ] ]  = name; 
				if ( $("#name-cont-" + data [ x ][ 0 ]).length != 0 ) {
					$("#name-cont-" + data [ x ][ 0 ]).html( name );
				}
				
			}
			
			updateBTSTable();
			
       	}
       	
		function updateCoinTable() {
			//createNewCommands( "task", { "task_name": "GetData", "params": {"query": "SELECT DISTINCT(latest.coin_id) as id, latest.coin_id as id, latest.coin_id as id, latest.last, temp, bat, snr, acc, rot, ir, led, type \
			//	FROM ( \
			//			   SELECT coin_id, MAX(time) \"last\" \
			//			   FROM public.\"Measurment\" \
			//			   GROUP BY coin_id \
			//			) as latest \
			//			INNER JOIN public.\"Measurment\" t on latest.coin_id = t.coin_id and latest.last = t.time \
			//			INNER JOIN public.\"Coins\" h on h.id = t.coin_id " } }, createNewTableDataSet ); 
			//requestCoinNameIdTable();
			

		}
		
		
		function updateBTSTable() {
			createNewCommands( "task", { "task_name": "GetData", "params": {"query": 'SELECT update, data, type, coin_id, acc, bat, snr, bp, spo2, breath, temp, rot, hr, active_config_id, ir_led_1, ir_led, g_led, g_led_1, r_led, r_led_1, x_led, y_led, z_led FROM public."Dashboard"' } }, createDashboard ); 
					
		}

		var load = new Loader();
        function setContainer( id, val ) {
    		$( "#" + id ).empty();
    		$( "#" + id ).html( val );
    		
        }
		function getContainerFromTine( last_com ) {
			
			if ( last_com <= 3600 ) {
				return "active_coins";
			}else if ( last_com > 3600 && last_com < 3600*3 ) {
				return "slightly_late_coins";
			}else if ( last_com => 3600*3 ) {
				return "really_late_coins";
			}
			return 0;
			
		}
		function changeContainerLocation( id, last_com, elem ) {

			var new_c = getContainerFromTine( last_com );
			var old_c = $("#"+id).parent();

			if ( new_c == old_c ) {
				return;
			}

			try{
				//elem.fadeOut();
				elem.remove();
			}catch{

			}
			
			$("#"+new_c).append( elem );
			//$("#"+id).fadeIn();
			
		}

		var ff = 0;

		
		function addData(chart, data1) {
			var c = 0;
			//console.log( chart ); 
		    chart.data.datasets.forEach((dataset) => {
		    	data1 = data1.replace( "{", "[" );
		    	data1 = data1.replace( "}", "]" );
		    	data1 = JSON.parse( data1 );
		    	for( i of data1 ) {
		    	
		    		while ( dataset.data.length >= MAX_GRAPH_SIZE+30 ){
		    			dataset.data.shift();
		    		}
		    		c++;
		         	dataset.data.push(i);
		         }
		        
		    });
		    chart.update();
			return c;
		}
		
		
		function addData1(chart, data1, data2) {
			var c = 0;
			//console.log( chart ); 
		    chart.data.datasets.forEach((dataset) => {
		    	data1 = data1.replace( "{", "[" );
		    	data1 = data1.replace( "}", "]" );
		    	data1 = JSON.parse( data1 );
		    	
		    	
		    	data2 = data2.replace( "{", "[" );
		    	data2 = data2.replace( "}", "]" );
		    	data2 = JSON.parse( data2 );
		    	
		    	var rr = [];
		    	
		    	for( var x = 0; x < data2.length; x++ ) {
		    		rr[ x ] = data2[ x ] + data1[ x ];
		    	}
		    	
		    	for( i of rr ) {
		    	
		    		while ( dataset.data.length >= MAX_GRAPH_SIZE+30 ){
		    			dataset.data.shift();
		    		}
		    		c++;
		         	dataset.data.push(i);
		         }
		        
		    });
		    chart.update();
			return c;
		}		
    	var coin_int = {};
    	
    	function setBatteryLevel( ids, bat, temp ) {
    		bat = parseInt( bat );

    		if ( bat > 3900 ) { 
    			$("#" + ids).attr("src","img/battery_full.png");
    		}else if ( bat < 3900 && bat >= 3750 ) { 
    			$("#" + ids).attr("src","img/battery_top.png");
    			
    		}else if ( bat < 3750 && bat >= 3600 ) { 
    			$("#" + ids).attr("src","img/battery_mid.png");
    			
    		}else if ( bat < 3600 && bat > 3500 ) { 
    			$("#" + ids).attr("src","img/battery_low.png");
    		}else if ( bat <= 3500  ) { 
    			$("#" + ids).attr("src","img/battery_dead.png");
    		}
    		
    	}
    	
     	function setSignalLevel( ids, snr ) {
    	    bat = parseInt( snr );
    		if ( bat <= 50 ) { 
    			$("#" + ids).attr("src","img/full_signal.png");
    		}else if ( bat >= 50 && bat <= 70 ) { 
    			$("#" + ids).attr("src","img/mid_signal.png");
    		}else if ( bat >= 70 && bat <= 250 ) { 
    			$("#" + ids).attr("src","img/low_signal.png");
    		}
    		
    	}  
    	function arrToData( data ) {
    		var resp1 = [];
    		for ( var i of data ) {
    			resp = i[ 1 ];
    			resp = resp.replace( '{', '[' );
    			resp = resp.replace( '}', ']' );
    			
				resp = JSON.parse( resp );
    			for ( var y of resp ) {
    				resp1.push( y ); 
    			}
    		}
    		return resp1;
    	
    	}
    	function createElementCoin2( coins, temp, acc, poloha, ir1, ir, g, g1, r, r1, last_com, snr, bat, time, t_bts ) {
			if ( $("#container-" + coins[ 0 ] ).length != 0 ) {
				changeContainerLocation( "container-" + coins[ 0 ], last_com,  $("#container-" + coins[ 0 ] ) );
			}else{
    			var elem = coin2_element;
                //<canvas id="ekg-IDS" ></canvas>
    	        elem = elem.replaceAll( "IDS", coins[ 0 ] );
    	        elem = elem.replaceAll( "NAMES", coin_table[ coins[ 0 ] ] );
    	        $("#active_coins").append( elem );
    	        //changeContainerLocation( "container-" + coins[ 0 ], last_com, elem );


        	        
			}
		
			var rr1 = arrToData( r1 );
			createLine( "r1-line-" + coins[ 0 ], rr1, "res", "#a80c0c" );
			
			var rr = arrToData( r );
			createLine( "r-line-" + coins[ 0 ], rr, "res", "#eb0e0e" );

			var irr1 = arrToData( ir1 );
			createLine( "ir1-line-" + coins[ 0 ], irr1, "blue", "#a1088f" );
			var irr = arrToData( ir );
			createLine( "ir-line-" + coins[ 0 ], irr, "blue", "#eb0ed1" );

			var gg1 = arrToData( g1 );
			createLine( "g1-line-" + coins[ 0 ], gg1, "green", "#119e2f" );
			var gg = arrToData( g );
			createLine( "g-line-" + coins[ 0 ], gg, "green", "#1ae846" );
			
		}    
		
    	function createElementCoin3( coins, temp, acc, poloha, ir1, ir, g, g1, r, r1, last_com, snr, bat, time, t_bts ) {
			if ( $("#container-" + coins[ 0 ] ).length != 0 ) {
				changeContainerLocation( "container-" + coins[ 0 ], last_com,  $("#container-" + coins[ 0 ] ) );
			}else{
    			var elem = coin2_element;
                //<canvas id="ekg-IDS" ></canvas>
    	        elem = elem.replaceAll( "IDS", coins[ 0 ] );
    	        elem = elem.replaceAll( "NAMES", coin_table[ coins[ 0 ] ] );
    	        $("#active_coins").append( elem );
    	        //changeContainerLocation( "container-" + coins[ 0 ], last_com, elem );


        	        
			}
		
			var rr1 = arrToData( r1 );
			createLine( "r1-line-" + coins[ 0 ], rr1, "res", "#a80c0c" );
			
			var rr = arrToData( r );
			createLine( "r-line-" + coins[ 0 ], rr, "res", "#eb0e0e" );

			var irr1 = arrToData( ir1 );
			createLine( "ir1-line-" + coins[ 0 ], irr1, "blue", "#a1088f" );
			var irr = arrToData( ir );
			createLine( "ir-line-" + coins[ 0 ], irr, "blue", "#eb0ed1" );

			var gg1 = arrToData( g1 );
			createLine( "g1-line-" + coins[ 0 ], gg1, "green", "#119e2f" );
			var gg = arrToData( g );
			createLine( "g-line-" + coins[ 0 ], gg, "green", "#1ae846" );
			
		}    		
			 	
		function createElement( coins, temp, acc, poloha, spo2, tep, pi, last_com, snr, bat, time, t_bts ) {
			if ( $("#container-" + coins[ 0 ] ).length != 0 ) {
			
			
			
				changeContainerLocation( "container-" + coins[ 0 ], last_com,  $("#container-" + coins[ 0 ] ) );
			}else{
    			
    			var elem = coin1_element;

    	        elem = elem.replaceAll( "IDS", coins[ 0 ] );
    	        elem = elem.replaceAll( "NAMES", coin_table[ coins[ 0 ] ] );

    	        changeContainerLocation( "container-" + coins[ 0 ], last_com, elem );


    			//createBar( "rot-line-" + coins[ 0 ], poloha );
    			//createLine( "spo2-line-" + coins[ 0 ], spo2 );
    			//createLine( "puls-line-" + coins[ 0 ], tep );
    			//createLine( "pi-line-" + coins[ 0 ], pi );
    			//createLine( "breath-line-" + coins[ 0 ], pi );

    			//createLine( "ekg-" + coins[ 0 ], [ 1000, 980, 970, 960,650,750,430 ] );

        	        
			}
			createLine( "temp-line-" + coins[ 0 ], temp );

			
			createBar( "acc-line-" + coins[ 0 ], acc );
			
			if ( parseInt( temp[ 0 ] ) == 0 ) {
    			setContainer( "temp-" + coins[ 0 ], "-" + " C" );
			}else{
    			setContainer( "temp-" + coins[ 0 ], temp[ 0 ] + " C" );
			}
			//setContainer( "acc-" + coins[ 0 ], acc[ 0 ]);
			// || parseInt( poloha[ 0 ] ) == 1
			if ( parseInt( poloha[ 0 ] ) == 0  ) {
				setContainer( "rot-" + coins[ 0 ], 'stojí/sedí' );
			} else if ( parseInt( poloha[ 0 ] ) == 2  ) {
				setContainer( "rot-" + coins[ 0 ], 'leží' );
			} else if ( parseInt( poloha[ 0 ] ) == 1  ) {
				setContainer( "rot-" + coins[ 0 ], 'leží na boku' );
				
			} else {
				setContainer( "rot-" + coins[ 0 ], '-' );
			}
			acc[ 0 ] = parseInt( acc[ 0 ] );
			
			if ( acc[ 0 ] < 64 ) {
				$("#charger-" + coins[ 0 ]).fadeOut();
			}else if ( acc[ 0 ] >= 64 ) {
				$("#charger-" + coins[ 0 ]).fadeIn();
			}
			
			if ( acc[ 0 ] > 128 ) {
				acc[ 0 ] = acc[ 0 ] - 128;
			} 
			
			if ( acc[ 0 ] >= 64 ) {
				acc[ 0 ] = acc[ 0 ] - 64;
			} 
			
			if ( parseInt( acc[ 0 ] ) >= 0 && parseInt( acc[ 0 ] ) < 10 ) {
				setContainer( "acc-" + coins[ 0 ], 'Slabá' );
			} else if ( parseInt( acc[ 0 ] ) >= 10 && parseInt( acc[ 0 ] ) < 30 ) {
				setContainer( "acc-" + coins[ 0 ], 'Stredná' );
			} else if ( parseInt( acc[ 0 ] ) >= 30 && parseInt( acc[ 0 ] ) < 50 ) {
				setContainer( "acc-" + coins[ 0 ], 'Vysoká' );
			}  
			
			if ( parseInt( poloha[ 0 ] ) > 60  ) {
				setContainer( "acc-" + coins[ 0 ], 'Pád!!' );
			} 
			
			fd = {};
			fd["t_core"] = [];
			fd["t_aux"] = [];
			var t_core = 1;
			var t_aux = 1;
			
			
			for( var y = 0; y < temp.length; y++ ) {
				
			
				if ( y == 0 ) {
					if ( parseInt( t_core ) < 36 ) {
    					setContainer( "core-" + coins[ 0 ], "-" + " C" );
					}else{
    					setContainer( "core-" + coins[ 0 ], 100/10 + " C" );
					}
					
					if ( parseInt( (t_core - t_aux))  < 34 ) {
						setContainer( "underarm-" + coins[ 0 ], "-" + " C" );
					}else{
						setContainer( "underarm-" + coins[ 0 ], 100/10 + " C" );
					}
					
				}
			}
			createLine( "core-temp-line-" + coins[ 0 ], fd["t_core"] );
			createLine( "unerarm-temp-line-" + coins[ 0 ], fd["t_aux"] );
			
			
			var val = parseInt( ((Date.now()/1000) -time ) );
			if ( val < 60  )
				setContainer( "time-" + coins[ 0 ],  "Pred minútou" );
			else if ( val < 360 )	
				setContainer( "time-" + coins[ 0 ],  "Pred 5 minútami" );
			else if ( val < 3600 )	
				setContainer( "time-" + coins[ 0 ],  "Pred 30 minútami" );
			else
				setContainer( "time-" + coins[ 0 ],  "Pred hodinami" );
			

			
			setBatteryLevel( "bat-" + coins[ 0 ]  + "-level", bat[0], 0 );
			setSignalLevel( "snr-" + coins[ 0 ]  + "-level", snr[0], 0 );
			
			
			//setContainer( "spo2-" + coins[ 0 ], spo2[ 0 ] + " %");
			//setContainer( "puls-" + coins[ 0 ], tep[ 0 ]);
			//setContainer( "pi-" + coins[ 0 ], pi[ 0 ] + " %");
			//setContainer( "breath-" + coins[ 0 ], pi[ 0 ] + " %");
		}
		var coin2_element;
		var coin1_element;
		
		function start() {

			//load.init();
			var ff = new liveUpdate();
			var ff1 = new liveUpdate1();

			var ff3 = Math.floor(Date.now() / 1000);

			global_socket_wrapper.init();
						global_socket_wrapper.registerLiveUpdater("new_coin_data", ff);
			

			$.ajax({
                url: "components/dash/main_element_coin2.php", 
                context: document.body,
                success: function(response) {
                    coin2_element = response;
                }
            });
            $.ajax({
                url: "components/dash/main_element_coin3.php", 
                context: document.body,
                success: function(response) {
                    coin2_element = response;
                }
            });
			$.ajax({
                url: "components/dash/main_element_coin1.php", 
                context: document.body,
                success: function(response) {
                    coin1_element = response;
                    requestCoinNameIdTable();
                }
            });
            
            
            setInterval( animationStep, 200 );
		}
		

		function searchChanged (){
			
			clearSerch( 1 );
			var search_str = $("#search-bar").val();
			for ( key in coin_table ) {
				var elems = "#container-"+key;
				var names = "" + coin_table[ key ];
				if ( elems.includes( search_str ) ==  true || names.includes( search_str ) ==  true  ) {

				}else{

					if ( $(elems).is(":hidden") == false ) {
						 $(elems).fadeOut();
						 
					}
					
				}
				
				 
			}
			
		}
		var active_id;
        function nameChanged() {
        	showInfoMsg( "Data saved", 2);
        }
		
		function changeName( id ) {
			active_id = id;
			$("#meno_s" ).html( id );
		}
        
        function sendNameChange() {
        
        	var names = $("#new_name").val();
        	
        	var timestamp = Date.now()/1000;
        	createNewCommands( "task", { "task_name": "GetData", "params": {"query": "UPDATE public.\"Coins\" SET  \"name\" = '" + names + "' WHERE id = " + active_id } }, nameChanged );
        	showInfoMsg( "Saving data...", 1);
        	//setTimeout( requestCoinNameIdTable, 6000 );
        	
        	//requestCoinNameIdTable();
        	$("#exampleModal").modal("hide");

        }
        		
		function clearSerch( v ) {
			if ( v == 0 ) 
				$("#search-bar").val('');
			
			for ( key in coin_table ) {
				var elems = "#container-"+key;
				
				if ( $(elems).is(":hidden") ) {
					 $(elems).fadeIn();
					 
				} 
			}
		}
		
</script>		
</head>

<body class="sidebar-mini" onload="start()" style="overflow:hidden;" >

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" >
  <div class="modal-dialog" role="document" id="dialog-windows">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Zmena mena <span id="meno_s"></span></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Zatvoriť">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p> <span class="item-elem">Nove meno:</span> <span class="item-elem" ><input type="text" id="new_name" placeholder="Nove meno..." /></span> </p>
        <p> <span></span> </p>
        
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Zatvoriť</button>
        <button type="button" class="btn btn-secondary" onclick="sendNameChange();">Uložiť</button>
      </div>
    </div>
  </div>
</div>

  <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 ps ps--active-y ps--scrolling-y momentum-scroll scroll-pane" style="overflow-y: scroll !important;">
    
    
    
      <!-- 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">
      	<p><i class="tim-icons icon-zoom-split" style="display:inline-block;"  ></i><input placeholder="Vyhladať..." id="search-bar" onchange="searchChanged()" class="form-control" style="display:inline-block;width:95%;margin-left:10px;" /><i class="tim-icons icon-simple-remove" onclick="clearSerch(1)" style="margin-left:10px;display:inline-block;"  ></i></p>
        <h3 style="width:100%; text-align:left!important;" class="text-center">Aktívna komunikácia</h3>
        <div class="row row-cols-1 row-cols-md-2" id="active_coins">

        </div>
        <h3 style="width:100%; text-align:left!important;" class="text-center">Posledná správa pred hodinou</h3>
        <div class="row row-cols-1 row-cols-md-2" id="slightly_late_coins">
        </div>   
        <h3 style="width:100%; text-align:left!important;" class="text-center">Posledná správa 3 hodinami</h3>
        <div class="row row-cols-1 row-cols-md-2" id="really_late_coins">

        </div>       

      </div>
      </div>
		
	     	        <?php
        
        $path = $_SERVER['DOCUMENT_ROOT'];
        $path .= "/components/footer.php";
        include_once($path);
        
        ?>
    </div>
  <!--   Core JS Files   -->
	     	        <?php
        
        $path = $_SERVER['DOCUMENT_ROOT'];
        $path .= "/components/code_footer.php";
        include_once($path);
        
        ?>

</body>

</html>
