Generate (on touchmove) a random colorful segment inside the canvas.

random_segments.js

document.addEventListener('touchmove', function (e) {
  e.preventDefault();
});
var c = document.getElementsByTagName('canvas')[0],
  x = c.getContext('2d'),
  pr = window.devicePixelRatio || 1,
  w = window.innerWidth,
  h = window.innerHeight,
  f = 90,
  q,
  m = Math,
  r = 0,
  u = m.PI * 2,
  v = m.cos,
  z = m.random,
  hue = 50;
c.width = w * pr;
c.height = h * pr;
x.scale(pr, pr);
x.globalAlpha = 1;


function y(p) {
  var t = p + (z() * 2 - 1.1) * f;
  return (t > h || t < 0) ? y(p) : t;
}

function d(t, j) {
  x.beginPath();
  x.moveTo(t.x, t.y);
  x.lineTo(j.x, j.y);
  var k = j.x + (z() * 2 - 0.25) * f,
    n = y(j.y);
  x.lineTo(k, n);
  x.closePath();
  r -= u / -50;
  hue += 10;
  x.fillStyle = 'hsl(' + hue + ', 70%, 60%)';
  x.fill();
  q[0] = q[1];
  q[1] = {x: k, y: n};
}

function i() {
  x.clearRect(0, 0, w, h);
  q = [{x: 0, y: h * 0.7 + f}, { x: 0, y: h * 0.7 - f}];
  while (q[1].x < w + f) {
    d(q[0], q[1]);
  }
}

document.onclick = i;
document.ontouchstart = i;

i();