JS1k: The JavaScript code golfing competition

L=300,k=a.width,q=a.height,r=Math,s=r.cos,t=r.sin,v=r.random,w=0,x=r.PI,y=[],z=[];function B(){a.width=k;for(j=0;7>j;j++)y[j]||(y[j]=C()),y[j]();w++;requestAnimationFrame(B)}
function C(){var l=j,h=.1+l*l/49,m=v()*k/h,n=q/h,A=3+5*v(),p=x,u=p,d=[];return function(){if(-L>m||m>k/h+L||-L>n||n>q/h+L){var b=k/h/2-m,e=q/h/2-n;p=u=r.atan(b/e)+(0>e?x:0)}else u+=.1*v()-.05,p-=.1*(p-u);m+=t(p)*A;n+=s(p)*A;for(i=0;70>i;i++)if(i){w||(d[i]={x:m,y:n});var e=d[i-1],b=d[i].x-e.x,e=d[i].y-e.y,g=r.sqrt(b*b+e*e),f=r.atan(e/b)+x/2+(0>b?x:0),g=4<g?.5:2<g?(g-2)/4:0;d[i].x-=b*g;d[i].y-=e*g;d[i].a=s(f);d[i].b=t(f);if(20==i)var l=f}else d[i]={x:m,y:n,a:0,b:0};c.moveTo(d[0].x,d[0].y);
for(i=0;154>i;i+=2)77>i?(b=i,e=1):(b=152-i,e=-1),f=z[b],g=d[z[b+1]],56<=b?(f=56-b,f=t(f/3+.1*w)*f*e,f=20-b/4+f,g=d[2*b-83]):13<b&&(f=4+(f-4)*(t((-f/2+w)/25*A/4)+2)*2,g.a=s(l),g.b=t(l)),c.lineTo((g.x+f*e*g.a)*h,(g.y+f*e*g.b)*h);c.fill()}}'! ((&(&*$($,&.)/-.0,4%3"7$;(@/EAA<?:<9;;88573729/7,6(8&;'.split("").map(function(l,h){z[h]=l.charCodeAt(0)-32});B();

TD0zMDAsaz1hLndpZHRoLHE9YS5oZWlnaHQscj1NYXRoLHM9ci5jb3MsdD1yLnNpbix2PXIucmFuZG9tLHc9MCx4PXIuUEkseT1bXSx6PVtdO2Z1bmN0aW9uIEIoKXthLndpZHRoPWs7Zm9yKGo9MDs3Pmo7aisrKXlbal18fCh5W2pdPUMoKSkseVtqXSgpO3crKztyZXF1ZXN0QW5pbWF0aW9uRnJhbWUoQil9DQpmdW5jdGlvbiBDKCl7dmFyIGw9aixoPS4xK2wqbC80OSxtPXYoKSprL2gsbj1xL2gsQT0zKzUqdigpLHA9eCx1PXAsZD1bXTtyZXR1cm4gZnVuY3Rpb24oKXtpZigtTD5tfHxtPmsvaCtMfHwtTD5ufHxuPnEvaCtMKXt2YXIgYj1rL2gvMi1tLGU9cS9oLzItbjtwPXU9ci5hdGFuKGIvZSkrKDA+ZT94OjApfWVsc2UgdSs9LjEqdigpLS4wNSxwLT0uMSoocC11KTttKz10KHApKkE7bis9cyhwKSpBO2ZvcihpPTA7NzA+aTtpKyspaWYoaSl7d3x8KGRbaV09e3g6bSx5Om59KTt2YXIgZT1kW2ktMV0sYj1kW2ldLngtZS54LGU9ZFtpXS55LWUueSxnPXIuc3FydChiKmIrZSplKSxmPXIuYXRhbihlL2IpK3gvMisoMD5iP3g6MCksZz00PGc/LjU6MjxnPyhnLTIpLzQ6MDtkW2ldLngtPWIqZztkW2ldLnktPWUqZztkW2ldLmE9cyhmKTtkW2ldLmI9dChmKTtpZigyMD09aSl2YXIgbD1mfWVsc2UgZFtpXT17eDptLHk6bixhOjAsYjowfTtjLm1vdmVUbyhkWzBdLngsZFswXS55KTsNCmZvcihpPTA7MTU0Pmk7aSs9Mik3Nz5pPyhiPWksZT0xKTooYj0xNTItaSxlPS0xKSxmPXpbYl0sZz1kW3pbYisxXV0sNTY8PWI/KGY9NTYtYixmPXQoZi8zKy4xKncpKmYqZSxmPTIwLWIvNCtmLGc9ZFsyKmItODNdKToxMzxiJiYoZj00KyhmLTQpKih0KCgtZi8yK3cpLzI1KkEvNCkrMikqMixnLmE9cyhsKSxnLmI9dChsKSksYy5saW5lVG8oKGcueCtmKmUqZy5hKSpoLChnLnkrZiplKmcuYikqaCk7Yy5maWxsKCl9fSchICgoJigmKiQoJCwmLikvLS4wLDQlMyI3JDsoQC9FQUE8Pzo8OTs7ODg1NzM3MjkvNyw2KDgmOycuc3BsaXQoIiIpLm1hcChmdW5jdGlvbihsLGgpe3pbaF09bC5jaGFyQ29kZUF0KDApLTMyfSk7QigpOw==

// further notes here maybe:
// http://codepen.io/raurir/pen/KoJLH/

var sw = a.width, 
sh = a.height, 
M = Math,
Mc = M.cos,
Ms = M.sin,
ran = M.random,
pfloat = 0, 
pi = M.PI, 
dragons = [], 
shape = [],


loop = function() {

  a.width = sw; // clear screen

  for ( j = 0; j < 7; j++) {
    if ( !dragons[j] ) dragons[j] = dragon(j); // create dragons initially
    dragons[j]();
  }

  pfloat++;

  requestAnimationFrame(loop);

},


dragon = function(index) {

  var scale = 0.1 + index * index / 49, 
    gx = ran() * sw / scale, 
    gy = sh / scale, 
    lim = 300, // this gets inlined, no good!
    speed = 3 + ran() * 5, 
    direction = pi, //0, //ran() * pi * 2, //ran(0,TAU), 
    direction1 = direction, 
    spine = [];

  return function() {

    // check if dragon flies off screen 
    if (gx < -lim || gx > sw / scale + lim || gy < -lim || gy > sh / scale + lim) {

      // flip them around

      var dx = sw / scale / 2 - gx,
        dy = sh / scale / 2 - gy;

      direction = direction1 = M.atan(dx/dy) + (dy < 0 ? pi : 0);

    } else {

       direction1 += ran() * .1 - .05;

       direction -= (direction - direction1) * .1;

    }

    // move the dragon forwards
    gx += Ms(direction) * speed;
    gy += Mc(direction) * speed;

    // calculate a spine - a chain of points
    // the first point in the array follows a floating position: gx,gy
    // the rest of the chain of points following each other in turn

    for (i=0; i < 70; i++) {

      if (i) {

        if (!pfloat) spine[i] = {x: gx, y: gy}

        var p = spine[i - 1],
          dx = spine[i].x - p.x,
          dy = spine[i].y - p.y,
          d = M.sqrt(dx * dx + dy * dy),
          perpendicular = M.atan(dy/dx) + pi / 2 + (dx < 0 ? pi : 0);

        // make each point chase the previous, but never get too close
        if (d > 4) {
          var mod = .5;
        } else if (d > 2){
          mod = (d - 2) / 4;
        } else {
          mod = 0;
        }

        spine[i].x -= dx * mod;
        spine[i].y -= dy * mod;
        // perpendicular is used to map the coordinates on to the spine
        spine[i].px = Mc(perpendicular);
        spine[i].py = Ms(perpendicular);

        if (i == 20) { // average point in the middle of the wings so the wings remain symmetrical
          var wingPerpendicular = perpendicular;
        }

      } else {

        // i is 0 - first point in spine
        spine[i] = {x: gx, y: gy, px: 0, py: 0}; 

      }

    }

    // map the dragon to the spine
    // the x co-ordinates of each point of the dragon shape are honoured
    // the y co-ordinates of each point of the dragon are mapped to the spine

    c.moveTo(spine[0].x,spine[0].y)

    for (i=0; i < 154; i+=2) { // shape.length * 2 - it's symmetrical, so draw up one side and back down the other

      if (i < 77 ) { // shape.length
        // draw the one half from nose to tail
        var index = i; // even index is x, odd (index + 1) is y of each coordinate
        var L = 1;
      } else {
        // draw the other half from tail back to nose
        index = 152 - i;  
        L = -1;
      }

      var x = shape[index];

      var spineNode = spine[shape[index+1]]; // get the equivalent spine position from the dragon shape

      if (index >= 56) {  // draw tail

        var wobbleIndex = 56 - index; // table wobbles more towards the end

        var wobble = Ms(wobbleIndex / 3 + pfloat * 0.1) * wobbleIndex * L;

        x = 20 - index / 4 + wobble;

        // override the node for the correct tail position
        spineNode = spine[ index * 2 - 83 ];

      } else if (index > 13) {  // draw "flappy wings"

        // 4 is hinge point
        x = 4 + (x-4) * (Ms(( -x / 2 + pfloat) / 25 * speed / 4) + 2) * 2; // feed x into sin to make wings "bend"

        // override the perpindicular lines for the wings
        spineNode.px = Mc(wingPerpendicular);
        spineNode.py = Ms(wingPerpendicular);

      }

      c.lineTo(
        (spineNode.x + x * L * spineNode.px) * scale, 
        (spineNode.y + x * L * spineNode.py) * scale
      );

    }

    c.fill();

  }

}

// the shape of the dragon, converted from a SVG image
'! ((&(&*$($,&.)/-.0,4%3"7$;(@/EAA<?:<9;;88573729/7,6(8&;'.split("").map(function(a,i) {
  shape[i] = a.charCodeAt(0) - 32;
});

loop();