var n=512;
var star_ratio=256;
var star_speed=4;

var sf;

$(document).ready(function(){
  $(".no-js").remove();
  $("body.starfield_background").prepend($('<canvas class="starfield background"></canvas>'));

  if($(".starfield")[0]){
    $(".starfield").mousemove(function(e){
      this.target_x = e.pageX-this.offsetLeft;
      this.target_y = e.pageY-this.offsetTop;
    });

    $(".starfield").resize(function(){
      var w=$(this).width();
      var h=$(this).height();
      var x=Math.round(w/2);
      var y=Math.round(h/2);
      this.z=(w+h)/2;
      this.star_color_ratio=1/sf.z;
      this.target_x=x;
      this.target_y=y;
    
      this.star=new Array(n);
      var a=0;
      for(var i=0;i<n;i++){
        this.star[i]=new Array(5);
        this.star[i][0]=Math.random()*w*2-x*2;
        this.star[i][1]=Math.random()*h*2-y*2;
        this.star[i][2]=Math.round(Math.random()*this.z);
        this.star[i][3]=0;
        this.star[i][4]=0;
      }
      this.width=w;
      this.height=h;
      this.context=this.getContext('2d');
      this.context.fillStyle='rgb(0,0,0)';
      this.context.strokeStyle='rgb(255,255,255)';
    });
    
    sf = $(".starfield")[0];
    
    sf.anim = function (){
      var w=$(this).width();
      var h=$(this).height();
      var x=Math.round(w/2);
      var y=Math.round(h/2);
      var mouse_x=x-this.target_x;
      var mouse_y=y-this.target_y;
      this.context.fillRect(0,0,w,h);
      for(var i=0;i<n;i++){
        var test=true;
        var star_x_save=this.star[i][3];
        var star_y_save=this.star[i][4];
        this.star[i][0]+=mouse_x>>6; if(this.star[i][0]>x<<1) { this.star[i][0]-=w<<1; test=false; } if(this.star[i][0]<-x<<1) { this.star[i][0]+=w<<1; test=false; }
        this.star[i][1]+=mouse_y>>6; if(this.star[i][1]>y<<1) { this.star[i][1]-=h<<1; test=false; } if(this.star[i][1]<-y<<1) { this.star[i][1]+=h<<1; test=false; }
        this.star[i][2]-=star_speed; if(this.star[i][2]>this.z) { this.star[i][2]-=this.z; test=false; } if(this.star[i][2]<0) { this.star[i][2]+=this.z; test=false; }
        this.star[i][3]=x+(this.star[i][0]/this.star[i][2])*star_ratio;
        this.star[i][4]=y+(this.star[i][1]/this.star[i][2])*star_ratio;
        if(star_x_save>0&&star_x_save<w&&star_y_save>0&&star_y_save<h&&test){
          this.context.lineWidth=(1-this.star_color_ratio*this.star[i][2])*2;
          this.context.beginPath();
          this.context.moveTo(star_x_save,star_y_save);
          this.context.lineTo(this.star[i][3],this.star[i][4]);
          this.context.stroke();
          this.context.closePath();
        }
      }
    }

    $(".starfield").resize();
    setInterval('sf.anim()',10);
  }
});