// JavaScript Document
function animatePath(map,cspath,dev_ident,odc,doc)
{
  var amap            = map;
  var interval;
  var data            = [];
  var tracks          = [];
  var dispDiv         = null;
  this.animate        = animate;
  this.clearLayer     = clearLayer;
  this.startAnimation = startAnimation;
  this.stopAnimation  = stopAnimation;
  this.setDisplayDiv  = setDisplayDiv;
  this.setNumTracks   = setNumTracks;
  this.setIcons       = setIcons;
  this.pauseAnimation = pauseAnimation;
  var animatePosition = 0;
  var innerPosition   = 0;
  var tracksCount     = 0;
  var isStoped        = false;
  var animateLayer = new OpenLayers.Layer.Markers("animate");
  amap.addLayer(animateLayer);
  
  
 
  $jq.get(cspath,{ident:dev_ident,from_date:odc,to_date:doc,xml:'yes'},function(xml)
  {
          if (window.ActiveXObject)
          {
            			var xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
            			xmlDoc.async="false";
            			xmlDoc.loadXML(xml);
          }
          // code for Mozilla, Firefox, Opera, etc.
          else if (document.implementation && document.implementation.createDocument)
          {
            		  var parser	=	new DOMParser();
            			var xmlDoc =	parser.parseFromString(xml,"text/xml");
          }
          myNodes = xmlDoc.getElementsByTagName("devicelist"); 
          
          for(var counter=0;counter<myNodes.length;counter++) 
          {
              var rec = [];
              itemNode = myNodes.item(counter);
              var devicex = itemNode.getElementsByTagName("devicex").item(0).firstChild.nodeValue;
              var devicey = itemNode.getElementsByTagName("devicey").item(0).firstChild.nodeValue; 
              var ehis  = itemNode.getElementsByTagName("deviceehis").item(0).firstChild.nodeValue;
              var devicelpdate = itemNode.getElementsByTagName("devicelpdate").item(0).firstChild.nodeValue; 
              var point = new OpenLayers.Geometry.Point(devicex, devicey);
	            var point_merc = OpenLayers.Projection.transform(point, "epsg:4326", "epsg:54004");
            
              rec[0] = point_merc;
              rec[1] = ehis;
              rec[2] = devicelpdate;
              data.push(rec);
          }
          if (data.length > 0)
          {
              startAnimation();
              $jq('#anipauseimg').show();
          }    
  });
  
  function setNumTracks(trnum)
  {
      tracksCount = trnum;
      for(var n=0;n <= trnum;n++) 
      {
          var icon = null;
          var size = new OpenLayers.Size(27,26);
          var offset = new OpenLayers.Pixel(-(size.w/2), - (size.h/2)  );
          var   icon = new OpenLayers.Icon(OpenLayers.Util.getImagesLocation() + 'marker-downarrow.png',size,offset);
          var marker = new OpenLayers.Marker(new OpenLayers.LonLat(0,0),icon)
          animateLayer.addMarker(marker); 
          tracks.push(marker);
      }
  }
  
  function setIcons(innerPosition,angle)
  {
      for(var n=0;n <tracks.length;n++)
      {
          if (n == innerPosition)
          {
              var myimgrotate = document.getElementById(tracks[n].getIcon().imageDiv.id ).getElementsByTagName("img"); 
              if (myimgrotate[0] == null)
                   myimgrotate = document.getElementById(tracks[n].getIcon().imageDiv.id ).getElementsByTagName("canvas");
                   
              $jq('#'+myimgrotate[0].id).rotate(angle,'rel');
          }
         
      }
  }
  
  function setDisplayDiv(id)
  {
      var paused = false;
      dispDiv = document.getElementById(id);
      dispDiv.innerHTML = 'loading animation ...';  
      jQuery(dispDiv).click(function() 
      {
          if (!paused)
          {
              paused = true;
              pauseAnimation(paused);
          }
          else
          {
              paused = false;
              pauseAnimation(paused);
          
          }
      
      });
  }
    
  function startAnimation()
  {
       interval = setInterval ( animate, 1000 );
       amap.zoomTo(10);
       
  }
  
  function pauseAnimation(isPause)
  {
       if (isPause)
       {
          clearInterval (interval);
       }   
       else
       {
          startAnimation();
       }      
  }
  
  function stopAnimation()
  {
      clearInterval (interval);
      
      clearLayer();
  }
  
  function animate()
  {
    
    if ((data.length - 1) ==  animatePosition)
    {
        stopAnimation();
        return;
    }
    
    //stop ce je display div null
    if (document.getElementById(dispDiv.id) == null)
    {
        stopAnimation();
        return;
    }
    
    var row     = data[animatePosition];
    var nextrow = data[animatePosition+1];
    var point1 = row[0];
    var point2 = nextrow[0];
    var descr = row[1];
    var datep = row[2];
    
    radians = Math.atan((point2.y - point1.y)/(point2.x - point1.x ));
    degrees = calculateAngle(point2.x,point2.y,point1.x,point1.y);
    
    
    setIcons(innerPosition,degrees);
    tracks[innerPosition].moveToLonLat(new OpenLayers.LonLat(point1.x,point1.y));
    
    amap.setCenter(new OpenLayers.LonLat(point1.x,point1.y),amap.getZoom(),false,false);
    dispDiv.innerHTML = descr + '  : ' +datep;
    
    
    if (innerPosition == tracksCount) {innerPosition = 0;} else {innerPosition++;}
    
    animatePosition++;
    
 
  }
  
  function calculateAngle(x1,y1,x2,y2)
  {
  
        var a = x2 - x1;
        var b = y2 - y1;
        
        if (a >= 0 && b >= 0)
        {
        if (a == 0)
        return 0;
        else
        return 90 - (Math.atan(b/a) * 180 / Math.PI);
        }
        else if (a >=0 && b < 0)
        {
        if (a == 0)
        return 180;
        else
        return 90 - (Math.atan(b/a) * 180 / Math.PI);
        }
        else if (a < 0 && b < 0)
        {
        return 270 - (Math.atan(b/a) * 180 / Math.PI);
        }
        else
        {
        return 270 - (Math.atan(b/a) * 180 / Math.PI)
        }

  }

  
  
  function clearLayer()
  {
      if (!isStoped)
      {
          isStoped = true;
          animateLayer.clearMarkers();
          amap.removeLayer(animateLayer);
          tracks     = [];
          data       = []; 
          dispDiv.innerHTML = '';
      }
  }






}