var Spark = function() {
  var self = this;
  this.b = template_directory+'/layout/';
  this.s = ['flusel1.png', 'flusel2.png', 'flusel3.png', 'flusel4.png', 'flusel5.png', 'flusel6.png'];
  this.i = this.s[this.random(this.s.length)];
  this.f = this.b + this.i; 
  this.n = document.createElement('img');  
          
  this.newSpeed().newPoint().display().newPoint().fly();
};

Spark.prototype.display = function() {
  $(this.n)
   .attr('src', this.f)
   .css('position', 'fixed')
   .css('z-index', this.random(20)+200)
   .css('top', this.pointY)
   .css('left', this.pointX)
   .css('opacity', 0);
                
  $(document.body).append(this.n);
  
  return this;
};

Spark.prototype.fly = function() {
  var self = this;
  
  $(this.n)
  .animate({
      "opacity": 1.0
  }, this.speed/2, 'easeInQuad')
  .animate({
      "opacity": 0.0
  }, this.speed/2, 'easeOutQuad')
  .animate({
      "top": this.pointY,
      "left": this.pointX
      }, {duration: this.speed, easing: 'easeInOutQuad', queue: false, complete: function(){ self.newSpeed().newPoint().fly(); } }      
  );
};

Spark.prototype.newSpeed = function() {
  this.speed = (this.random(5) + 5) * 3000;
  return this;
};

Spark.prototype.newPoint = function() {
  //this.pointX = this.random(window.innerWidth - 100);
  this.pointX = this.random(400);
  this.pointY = this.random(600);
  return this;
};

Spark.prototype.random = function(max) {
  return Math.ceil(Math.random() * max) - 1;
}

$(function(){
  // Sparks
  var totalSparks = 25;
  var sparks = [];
  for (i = 0; i < totalSparks; i++){  
    sparks[i] = new Spark();
  }
});