var canvas = document.getElementById("c");
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
var ctx = canvas.getContext("2d");
ctx.strokeStyle = "white";
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.arc(r + leftMargin, canvas.height/2, r, 0, Math.PI*2, true);
x = Math.cos(angle) * r + r + leftMargin;
y = Math.sin(angle) * r + canvas.height/2;
ctx.arc(x, y, 4, 0, Math.PI*2, true);
for(var xx = 0; xx < points.length; ++xx) {
ctx.lineTo(r * 2 + leftMargin +xx, points[points.length-xx]);
window.requestAnimationFrame(draw);
window.requestAnimationFrame(draw);
var speedSlider = document.getElementById("speedSlider");
speedSlider.step = 0.001;
speedSlider.value = speed;
speedSlider.addEventListener("change", function () {
speed = parseFloat(this.value);
var radiusSlider = document.getElementById("radiusSlider");
radiusSlider.addEventListener("change", function () {
r = parseInt(this.value);
if(canvas.width != window.innerWidth) {
canvas.width = window.innerWidth;
if(canvas.height != window.innerHeight) {
canvas.height = window.innerHeight;
ctx.strokeStyle = "white";
function debounce(func, wait, immediate) {
var context = this, args = arguments;
if (!immediate) func.apply(context, args);
var callNow = immediate && !timeout;
timeout = setTimeout(later, wait);
if (callNow) func.apply(context, args);
var debouncedResize = debounce(resize, 250);
window.addEventListener("resize", debouncedResize, false);