robertorgarcia/index.html

## index.html
<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function () {

var dps = []; // dataPoints
var chart = new CanvasJS.Chart("chartContainer", {
        title :{
                text: "John Doe"
        },
        axisY: {
                includeZero: false,
                viewportMinimum: 0,
                viewportMaximum: 110
        },
        axisX: {
                viewportMinimum: 0,
                viewportMaximum: 20
        },
        data: [{
                type: "line",
                dataPoints: dps
        }]
});

var xVal = 0;
var yVal = 100;
var updateInterval = 1000;
var dataLength = 20; // number of dataPoints visible at any point

var updateChart = function (count) {

        count = count || 1;

        if(yVal<0){
                yVal = 100;
        }
        if(xVal==21){
                xVal = 0;
                dps.length = 0;
        }

        for (var j = 0; j < count; j++) {
                yVal = yVal - (Math.random());
                dps.push({
                        x: xVal,
                        y: yVal
                });
                xVal++;
        }
        if (dps.length > dataLength) {
                dps.shift();
        }
        chart.render();
};
updateChart(dataLength);
setInterval(function(){updateChart()}, updateInterval);
}

// Set the date we're counting down to
var countDownDate = new Date("Oct 21, 2018 18:37:25").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get todays date and time
  var now = new Date().getTime();

  // Find the distance between now and the count down date
  var distance = countDownDate - now;

  // Time calculations for days, hours, minutes and seconds
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  // Display the result in the element with id="demo"
  document.getElementById("demo").innerHTML = hours + "h "
  + minutes + "m " + seconds + "s ";

  // If the count down is finished, write some text
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }
}, 1000);

</script>
</head>
<body>
<div id="chartContainer" style="width: 100%; height: 300px"></div>
<div id="timer" style="width: 100%; height: 100px; text-align: center">
<p style="color:red;font-family:verdana;font-size:300%">You can go out in:</p>
<p id="demo" style="color:red;font-family:verdana;font-size:300%"></p>
</dive>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
</body>
</html>
	<!DOCTYPE HTML>
	<html>
	<head>
	<script>
	window.onload = function () {

	var dps = []; // dataPoints
	var chart = new CanvasJS.Chart("chartContainer", {
	title :{
	text: "John Doe"
	},
	axisY: {
	includeZero: false,
	viewportMinimum: 0,
	viewportMaximum: 110
	},
	axisX: {
	viewportMinimum: 0,
	viewportMaximum: 20
	},
	data: [{
	type: "line",
	dataPoints: dps
	}]
	});

	var xVal = 0;
	var yVal = 100;
	var updateInterval = 1000;
	var dataLength = 20; // number of dataPoints visible at any point

	var updateChart = function (count) {

	count = count \|\| 1;

	if(yVal<0){
	yVal = 100;
	}
	if(xVal==21){
	xVal = 0;
	dps.length = 0;
	}

	for (var j = 0; j < count; j++) {
	yVal = yVal - (Math.random());
	dps.push({
	x: xVal,
	y: yVal
	});
	xVal++;
	}
	if (dps.length > dataLength) {
	dps.shift();
	}
	chart.render();
	};
	updateChart(dataLength);
	setInterval(function(){updateChart()}, updateInterval);
	}

	// Set the date we're counting down to
	var countDownDate = new Date("Oct 21, 2018 18:37:25").getTime();

	// Update the count down every 1 second
	var x = setInterval(function() {

	// Get todays date and time
	var now = new Date().getTime();

	// Find the distance between now and the count down date
	var distance = countDownDate - now;

	// Time calculations for days, hours, minutes and seconds
	var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
	var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
	var seconds = Math.floor((distance % (1000 * 60)) / 1000);

	// Display the result in the element with id="demo"
	document.getElementById("demo").innerHTML = hours + "h "
	+ minutes + "m " + seconds + "s ";

	// If the count down is finished, write some text
	if (distance < 0) {
	clearInterval(x);
	document.getElementById("demo").innerHTML = "EXPIRED";
	}
	}, 1000);

	</script>
	</head>
	<body>
	<div id="chartContainer" style="width: 100%; height: 300px"></div>
	<div id="timer" style="width: 100%; height: 100px; text-align: center">
	<p style="color:red;font-family:verdana;font-size:300%">You can go out in:</p>
	<p id="demo" style="color:red;font-family:verdana;font-size:300%"></p>
	</dive>
	<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
	</body>
	</html>