function BusAnimation() {
  this.initialize();
}

BusAnimation.init = function() {
  BusAnimation.instance = new BusAnimation();
}


BusAnimation.prototype.initialize = function() {
  this.bus = document.getElementById("busani_bus");
  if(!this.bus) { return; }
  if(!this.bus.style) { return; }
  var s = this.bus.style;
  if(s.MozTransition != undefined) {
    this.stylePropertyTransition = "MozTransition";
    this.styleProperty = "-moz-transform";
    this.eventTypeTransitionEnd = "transitionend";
    this.setTransitionPosition = this.setTransitionPositionMozilla;
  } else if(s.webkitTransition != undefined) {
    this.stylePropertyTransition = "webkitTransition";
    this.styleProperty = "-webkit-transform";
    this.eventTypeTransitionEnd = "webkitTransitionEnd";
    this.setTransitionPosition = this.setTransitionPositionWebKit;
  } else if(s.OTransition != undefined) {
    this.stylePropertyTransition = "OTransition";
    this.styleProperty = "-o-transform";
    this.eventTypeTransitionEnd = "OTransitionEnd";
    this.setTransitionPosition = this.setTransitionPositionOpera;
  }
  
  
  
  //delete this.eventTypeTransitionEnd;
  
  if(this.eventTypeTransitionEnd != undefined) {
  
    if(this.setTransitionPosition == undefined) {
      this.setTransitionPosition = this.setTransitionPositionOther;
      this.styleProperty = "left";
      
    }
    this.animate = this.animateTransition;
    
    this.bus.addEventListener( this.eventTypeTransitionEnd, function() {
      instance.nextStep();
    }, true);
    
  } else {
    window.requestAnimFrame = (function(){
      return  window.requestAnimationFrame       || 
              window.webkitRequestAnimationFrame || 
              window.mozRequestAnimationFrame    || 
              window.oRequestAnimationFrame      || 
              window.msRequestAnimationFrame     || 
              function(/* function */ callback, /* DOMElement */ element){
                window.setTimeout(callback, 1000 / 60);
              };
    })();
  
    this.animate = this.animateAnimationFrame;
  }
  
  
  
  this.initialPosition = this.currentPosition = -400;
  
  this.animationStep = -1;
  
  
  this.delayID = -1;
  
  var instance = this;

  
  
  this.nextStep();  
}

BusAnimation.prototype.nextStep = function() {
  if(this.delayID != -1) { return; }
  
  this.animationStep++;
  
  switch(this.animationStep) {
    case 0:
    this.targetPosition = 200;
    this.interval = 1000;
    this.points = new Array(0.13,0.77,0.35,0.96);
    this.animate();
    break;
    
    case 1:
    this.delay(1000);
    break;
    
    case 2:
    this.targetPosition = 1200;
    this.interval = 3000;
    this.points = new Array(0.51,0.18,0.48,0.53);
    this.animate();
    break;
    
    
    
    case 3:
    this.targetPosition = this.initialPosition;
    this.interval = 0;
    this.points = new Array(0.77,0.02,0.97,0.12);
    this.animate();
    this.delay(2000);
    break;
    
    default:
    this.animationStep = -1;
    this.nextStep();
    break;
  }
}


BusAnimation.prototype.delay = function(ms) {
  var instance = this;
  instance.delayID = setInterval(function(e) {
    clearInterval(instance.delayID);
    instance.delayID = -1;
    instance.nextStep();
  },ms);
}

BusAnimation.prototype.animateAnimationFrame = function() {
  this.bezier = new AnimationBezier( this.points );
  this.stepStart = this.getTimer();
  this.onFrameDone();
  
}
BusAnimation.prototype.onFrameDone = function() {
  var instance = this;
  requestAnimFrame( function() { instance.onFrame() }, null );
}



BusAnimation.prototype.getTimer = function() {
  return (new Date()).getTime();
}

BusAnimation.prototype.onFrame = function() {
  var stepCurrent = this.getTimer() - this.stepStart;
  var stepNormal = stepCurrent / this.interval;
  if(stepNormal>1) {
    this.currentPosition = this.targetPosition;
    this.nextStep();
    return;
  }
  
  
  var normal = this.bezier.getValue( stepNormal );
  var pos = this.currentPosition + normal*(this.targetPosition-this.currentPosition);
  this.bus.style.left = pos+"px";
  this.onFrameDone();
}

BusAnimation.prototype.animateTransition = function() {
  var interval = this.interval/1000 + "s";
  this.bus.style[ this.stylePropertyTransition ] = this.styleProperty+" "+interval+" cubic-bezier("+this.points.join(",")+")";
  this.setTransitionPosition();
}
BusAnimation.prototype.setTransitionPositionOther = function() {
  this.bus.style.left = this.targetPosition+"px";
}

BusAnimation.prototype.setTransitionPositionWebKit = function() {
  this.bus.style.webkitTransform = "translate3D("+this.targetPosition+"px, 0px, 0px)";
}

BusAnimation.prototype.setTransitionPositionMozilla = function() {
  this.bus.style.MozTransform = "translateX("+this.targetPosition+"px)";
}


BusAnimation.prototype.setTransitionPositionOpera = function() {
  this.bus.style.OTransform = "translateX("+this.targetPosition+"px)";
}



function AnimationBezier(points) {
  this.Cx = 3 * points[0];
  this.Bx = 3 * (points[2] - points[0]) - this.Cx;
  this.Ax = 1 - this.Cx - this.Bx;

  this.Cy = 3 * points[1];
  this.By = 3 * (points[3] - points[1]) - this.Cy;
  this.Ay = 1 - this.Cy - this.By;
}

AnimationBezier.prototype.bezier_x = function(t) { return t * (this.Cx + t * (this.Bx + t * this.Ax)); }
AnimationBezier.prototype.bezier_y = function(t) { return t * (this.Cy + t * (this.By + t * this.Ay)); }
AnimationBezier.prototype.bezier_x_der = function(t) { return this.Cx + t * (2*this.Bx + 3*this.Ax * t); }
AnimationBezier.prototype.find_x_for = function(t) {
  var x=t, i=0, z;

  while (i < 5) {
    z = this.bezier_x(x) - t;
    if (Math.abs(z) < 1e-3) break;
    x = x - z/this.bezier_x_der(x);
    i++;
  }
  return x;
}
AnimationBezier.prototype.getValue = function(t) {
  return this.bezier_y(this.find_x_for(t));
}

