<?php

	####################################################################################################
	#	WUDATACHARTS by BRIAN UNDERDOWN 2016                                                           #
	#	CREATED FOR HOMEWEATHERSTATION TEMPLATE at http://weather34.com/homeweatherstation/index.html  #
	# 	                                                                                               #
	# 	built on CanvasJs  	                                                                           #
	#   canvasJs.js is protected by CREATIVE COMMONS LICENCE BY-NC 3.0  	                           #
	# 	free for non commercial use and credit must be left in tact . 	                               #
	# 	                                                                                               #
	# 	Weather Data is based on your PWS upload quality collected at Weather Underground 	           #
	# 	                                                                                               #
	# 	Second General Release: 4th October 2016  	                                                   #
	# 	                                                                                               #
	#   http://www.weather34.com 	                                                                   #
	####################################################################################################

	include('chartslivedata.php');include('./chart_theme.php');header('Content-type: text/html; charset=utf-8');
	$weatherfile = '1yrlakelevels.txt';


  $conv = 1;
	if ($lakeunit == 'ft') {
    $conv = '0.03048';
  } else if ($lakeunit == 'm') {
    $conv = '1';
  }

	if ($lakeunit == 'mm'){
		$lakedecimal = '0';
	} else {
		$lakedecimal = '2';
	}

	/*$interval = '\'auto\'';
	if ($windunit == 'mph') {$interval= '0.5';}
	else if ($windunit == 'm/s') {$interval= '1';}
	else if ($windunit == 'km/h'){$interval= '1';}*/
    echo '
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
		<title>OUTDOOR LAKELEVEL YEAR CHART</title>
		<script src=../js/jquery.js></script>
			';
	?>
    <br>
    <script type="text/javascript">
        $(document).ready(function () {
		var dataPoints1 = [];
		var dataPoints2 = [];
		$.ajax({
			type: "GET",
			url: "../jsondata/alllakelevels.txt",
			dataType: "text",
			cache:false,
			success: function(data) {processData1(data),processData2(data);}
		});

	function processData1(allText) {
		var allLinesArray = allText.split('\n');
		if(allLinesArray.length>0){

			for (var i = 54; i <= allLinesArray.length-1; i++) {
				var rowData = allLinesArray[i].split(',');
				if ( rowData.length >1){
				    if (rowData[1] >= 600){
					dataPoints1.push({label:moment(rowData[0],'YYYY-MM-DD').format("MMM-DD-YYYY"),y:parseFloat(rowData[1]*1)});
					//dataPoints1.push({label: rowData[0],y:parseFloat(rowData[1]*1)});

			}}}
		}
		requestTempCsv();}function requestTempCsv(){}

	function processData2(allText) {
		var allLinesArray = allText.split('\n');
		if(allLinesArray.length>0){

			for (var i = 54; i <= allLinesArray.length-1; i++) {
				var rowData = allLinesArray[i].split(',');
				if ( rowData.length >1){
				    if (rowData[1] >= 600){
					dataPoints2.push({label:moment(rowData[0],'YYYY-MM-DD').format("YYYY"),y:parseFloat(715*1)});
					//dataPoints2.push({label: rowData[0],y:parseFloat(rowData[715]*1)});
					//parseFloat(rowData[13])});

			}}}
			drawChart(dataPoints1, dataPoints2 );
		}
	}


	function drawChart( dataPoints1 , dataPoints2 ) {
		var chart = new CanvasJS.Chart("chartContainer2", {
		 backgroundColor: '<?php echo $darkbackgroundcolor;?>',
		  animationEnabled: true,
		  animationDuration: <?php echo $animationduration;?>,

		title: {
             text: "",
			fontSize: 12,
			fontColor: '<?php echo $darkfontcolor;?>',
			fontFamily: "arial",
        },
		toolTip:{
			   fontStyle: "normal",
			   cornerRadius: 4,
			   backgroundColor: '<?php echo $darktooltipbackgroundcolor;?>',
			   contentFormatter: function(e) {
      var str = '<span style="color: <?php echo $darkfontcolor;?>;">' + e.entries[0].dataPoint.label + '</span><br/>';
      for (var i = 0; i < e.entries.length; i++) {
        var temp = '<span style="color: ' + e.entries[i].dataSeries.color + ';">' + e.entries[i].dataSeries.name + '</span> <span style="color: <?php echo $darkfontcolor;?>;">' + e.entries[i].dataPoint.y.toFixed(2) + "<?php echo ' '.$lakeunit ;?>" + '</span> <br/>';
        str = str.concat(temp);
      }
      return (str);
    },
			   shared: true,
 },
		axisX: {
			gridColor: '<?php echo $darkgridcolor;?>',
		    labelFontSize: 10,
			labelFontColor: '<?php echo $darkfontcolor;?>',
			lineThickness: 1,
			gridThickness: 1,
			gridDashType: "dot",
			titleFontFamily: "arial",
			labelFontFamily: "arial",
			minimum:0,
			interval: 365,
			intervalType:"day",
			xValueType: "dateTime",
			includezero: false,
			crosshair: {
        enabled: true,
        snapToDataPoint: true,
        color: '<?php echo $darkxcrosshaircolor;?>',
        labelFontColor: "#F8F8F8",
        labelFontSize:11,
        labelBackgroundColor: '<?php echo $darkxcrosshaircolor;?>',
      }
    },

		axisY:{
		title: "",
		titleFontColor: '<?php echo $darkfontcolor;?>',
		titleFontSize: 10,
        titleWrap: false,
		margin: 0,
		lineThickness: 1,
		gridThickness: 1,
		includeZero: false,
		gridDashType: "dot",
		gridColor: '<?php echo $darkgridcolor;?>',
		labelFontSize: 11,
		labelFontColor: '<?php echo $darkfontcolor;?>',
		titleFontFamily: "arial",
		labelFontFamily: "arial",
		labelFormatter: function ( e ) {
        return e.value .toFixed(2) + " <?php echo $lakeunit ;?> " ;
         },
		crosshair: {
			enabled: true,
			snapToDataPoint: true,
			color: '<?php echo $darkxcrosshaircolor;?>',
			labelFontColor: "#fff",
			labelFontSize:10,
			labelMaxWidth:60,
			labelBackgroundColor: '<?php echo $darkxcrosshaircolor;?>',
			labelFormatter: function ( e ) {
        return e.value .toFixed(2) + " <?php echo $lakeunit ;?> " ;
         },
		}
      },

	  legend:{
      fontFamily: "arial",
      fontColor: '<?php echo $fontcolor;?>',

 },


		data: [
		{
			//rainfall
			type: "splineArea",
			color: '<?php echo $darkline1color;?>',
			lineColor: '<?php echo $darkline1linecolor;?>',
			markerSize:0,
      markerColor: '<?php echo $darkline1color;?>',
			showInLegend:true,
			legendMarkerType: "circle",
			lineThickness: 2,
      //lineColor: '<?php echo $line2color;?>',
			markerType: "circle",
			name:"<?php echo "Lake Level" ;?>",
			dataPoints: dataPoints1,
			yValueFormatString:"##.## <?php echo $lakeunit ;?>",
		},
		{
                        type: "spline",
                        color: '<?php echo $darkline2color;?>',
                        markerSize:0,
      markerColor: '<?php echo $darkline2color;?>',
                        showInLegend:true,
                        legendMarkerType: "circle",
                        lineThickness: 2,
      //lineColor: '<?php echo $line2color;?>',
                        markerType: "circle",
                        name:"<?php echo 'Full Level' ;?>",
                        dataPoints: dataPoints2,
                        yValueFormatString:"##.## feet",

		}

		]
		});

		chart.render();
	}
});

    </script>
     <link rel="stylesheet" href="weather34chartstyle-<?php echo $charttheme;?>.css">

<body>
<div id="chartContainer2" style="width:auto;height:220px;padding:0;margin-top:-25px;border-radius:3px;border: 1px solid rgba(245, 247, 252,.02);
  box-shadow: 2px 2px 6px 0px  rgba(0,0,0,0.6);-webkit-font-smoothing: antialiased;     -moz-osx-font-smoothing: grayscale;"></div></div>

</body>
<script src='canvasJs.js'></script>
<script src='moment.js'></script>
</html>

