var pathEngine = {
  // draw canvas  
  canvas: '',
  // grouped objects
  objectsSet: '',  
  //objects list (array properties) 
  //used to remember some objects (to enable changing its properties)
  objects: {
    pathLabels: []
  },
  // objects properties
  opt : {
    circleSize: 5,
    circleAnimateSize: 10,
    circleAnimateTime: 200,
    strokeWidth: 3,
    textDeltaX: 5,
    textDeltaY: 6,
    textDeltaXIe: 5,
    textDeltaYIe: 10,    
    textBoxMargin: 5,
    tooltipFont : {"font": '11px "Arial"', stroke: "none", fill: "#01619e", 'text-anchor': 'start'},
    tooltipBackground : '#FFF',
    tooltipStroke : "#01619e"
  },
  timerObj : null,
  //current drew paths
  curPath: {
    id: ''
  },
  drawPathLabels: true,
  tooltipRect: '',
  tooltipText: ''
}

pathEngine.prototype = {}

pathEngine.init = function(settings) {  
  jQuery.extend(this.opt, settings);    
  
  if ($.browser.msie)
  {
    this.opt.textDeltaX = this.opt.textDeltaXIe;
    this.opt.textDeltaY = this.opt.textDeltaYIe;
  }
}

/**
 * 
 */
pathEngine.showPath = function (caller, type, id) {
  this.removeCanvas();
  
  if (typeof(id) != 'undefined')
  {   
    this.curPath.id = id;
    ajax.callUrl(new Array(new Array('action','getPath'), new Array('id',id), new Array('scale', mapEngine.scale)), this.getPathCallback);
    return;
  }    
  
  if (type == 'zoom')
  {   
    ajax.callUrl(new Array(new Array('action','getPath'), new Array('id',id), new Array('scale', mapEngine.scale)), this.getPathCallback);
    return;
  }
  
  selectId = '#'+type+'_Select';    
  if ($(selectId).length > 0)
  {
    cords = $(selectId).val().split("_");
    posX = -1 * cords[0];
    posY = -1 * cords[1];
    objId = cords[2];
    //TODO obsluga bledow
  }
  else
      return;
  
  cords = mapEngine.transformCoordinates(mapEngine.scale, posX + mapEngine.areaWidth/2, posY  + mapEngine.areaHeight/2);
  left = cords[0];
  top1 = cords[1];
  
  //go to position    
  //move or jump?    
  document.getElementById("parts").style.left = left+"px";  
  document.getElementById("parts").style.top = top1+"px";
  
  //clear last pointer?
  //show pointer?
  mapEngine.addParts(left, top1); 
  
  //validacja  
  this.curPath.id = objId;
  ajax.callUrl(new Array(new Array('action','getPath'), new Array('id',objId), new Array('scale', mapEngine.scale)), this.getPathCallback);
}

pathEngine.showAllPaths = function (type) {
  this.showPath('', '', type);
}

pathEngine.selectKeyPress = function() {
  pathEngine.timer = true;     
}

pathEngine.selectClick = function() {
  pathEngine.timer = false;     
}

pathEngine.selectChange = function(a,b) {
  if (pathEngine.timer)
  {
    delay = 1000;
    clearTimeout( pathEngine.timerObj );
    pathEngine.timerObj = setTimeout( function(){pathEngine.showPath(a,b);}, delay );
//    mapEngine.timerObj = setTimeout( "alert('a');", delay );
  }
  else
  {
    clearTimeout( pathEngine.timerObj );
    pathEngine.showPath(a,b);
  }
}

pathEngine.drawPaths = function (pathsData) {
  var pathSVG = '';
  var lastLeft = -1;
  var lastTop = -1;
  var pathLength = 0;
  var color;
  var obj;
  var middleLeft, middleTop;
  var leave_timer;
  var is_label_visible = false;
  var pathLabel = {rect: '', text: ''};
  var point = {x: '', y: '', text: ''};
  var i = 0;
  var tooltip, popup;    
  
  this.canvas = Raphael(document.getElementById("pathContener"), controller.opt.mapWidth, controller.opt.mapHeight);  
  this.objectsSet = this.canvas.set();    
  pathEngine.tooltipRect =  this.canvas.rect(0, 0, 30, 15, 5).attr({fill: this.opt.tooltipBackground, stroke: this.opt.tooltipStroke, "stroke-width": 1}).hide();
  this.objectsSet.push(pathEngine.tooltipRect);
  pathEngine.tooltipText = this.canvas.text(0, 0, '').attr(this.opt.tooltipFont).hide();
  this.objectsSet.push(pathEngine.tooltipText);
  
  for (path in pathsData)
  {    
    pathSVG = '';
    lastLeft = -1;
    lastTop = -1;   
    
    color = '#'+pathsData[path].color;
//    alert(pathsData[path].parts);
    //TODO - check exists
    pathLength = pathsData[path].parts.length;
    for(var parts=0; parts < pathLength; parts++)
    //for (parts in pathsData[path].parts)
    {
      tooltip = false;
      popup = false;
//      if (lastLeft != -1)
//        pathSVG += 'L ' + lastLeft + ' ' + lastTop + ' ';  
      if (parts+1 < pathLength)
      {
        if (lastLeft != -1)
          pathSVG += 'L ' + pathsData[path].parts[parts].left + ' ' + pathsData[path].parts[parts].top + ' ';
        
        pathSVG += 'M ' + pathsData[path].parts[parts].left + ' ' + pathsData[path].parts[parts].top + ' ';
      }

      if (pathsData[path].parts[parts].hasOwnProperty('selected') && pathsData[path].parts[parts].selected == 'Y')
        this.objectsSet.push(this.canvas.circle(+pathsData[path].parts[parts].left, +pathsData[path].parts[parts].top, this.opt.circleSize+5));
                  
      if (pathsData[path].show_marker == 'Y' && pathsData[path].parts[parts].show_marker == 'Y')
      {      
        obj = this.canvas.circle(+pathsData[path].parts[parts].left, +pathsData[path].parts[parts].top, this.opt.circleSize);             
        this.objectsSet.push(obj);
//        objs[curObj].translate(20,40);
        obj.attr({id: 'svg'+pathsData[path].parts[parts].popupdiv, stroke: color, fill: color});                

        obj.drawData = {};
        if (pathsData[path].show_tooltip == 'Y' && pathsData[path].parts[parts].tooltip != '')
        {
         tooltip = true;
         obj.drawData.x = +pathsData[path].parts[parts].left;
         obj.drawData.y = +pathsData[path].parts[parts].top;
         obj.drawData.tooltip = pathsData[path].parts[parts].tooltip;       
        } 
        
        // label description
        if (pathsData[path].parts[parts].hasOwnProperty('popupdiv') && pathsData[path].show_description == 'Y' )
        {          
          popup = true;
                                       
          $('#'+'svg'+pathsData[path].parts[parts].popupdiv).fancybox({
            'frameWidth':    230, 
            'frameHeight': 100,
            'hideOnContentClick': false,
            'notAhref': '#'+pathsData[path].parts[parts].popupdiv}
           );          
        }
        
        if (popup)
        {
          if (tooltip)
          {
            obj.mouseover(function () {
//              alert(this.drawData.tooltip);
              pathEngine.tooltipText.attr({'text': this.drawData.tooltip}).animate({'x': this.drawData.x + pathEngine.opt.textDeltaX, 'y': this.drawData.y + pathEngine.opt.textDeltaY}, 0).show();
              width = pathEngine.tooltipText.getBBox().width;
              if (width != 0)
                pathEngine.tooltipRect.animate({'x': this.drawData.x, 'y': this.drawData.y, 'width': width + pathEngine.opt.textBoxMargin*2}, 0).show();               

              pathEngine.tooltipRect.toFront();
              pathEngine.tooltipText.toFront();
              this.animate({r: pathEngine.opt.circleAnimateSize}, pathEngine.opt.circleAnimateTime);
            });
            
            obj.mouseout(function () {
              pathEngine.tooltipRect.hide();
              pathEngine.tooltipText.hide();
              this.animate({r: pathEngine.opt.circleSize}, pathEngine.opt.circleAnimateTime);
            });            
          }
          else
          {
            obj.mouseover(function () {
              this.animate({r: pathEngine.opt.circleAnimateSize}, pathEngine.opt.circleAnimateTime);
            });
            
            obj.mouseout(function () {
              this.animate({r: pathEngine.opt.circleSize}, pathEngine.opt.circleAnimateTime);
            });            
          }
        }
        else
        {
          obj.mouseover(function () {
//            alert(this.drawData.tooltip);
            pathEngine.tooltipText.attr({'text': this.drawData.tooltip}).animate({'x': this.drawData.x + pathEngine.opt.textDeltaX, 'y': this.drawData.y + pathEngine.opt.textDeltaY}, 0).show();
            width = pathEngine.tooltipText.getBBox().width;
            if (width != 0)
              pathEngine.tooltipRect.animate({'x': this.drawData.x, 'y': this.drawData.y, 'width': width + pathEngine.opt.textBoxMargin*2}, 0).show();
            
            pathEngine.tooltipRect.toFront();
            pathEngine.tooltipText.toFront();            
          });          
          
          obj.mouseout(function () {
            pathEngine.tooltipRect.hide();
            pathEngine.tooltipText.hide();
          });          
        }
      }
      
      //draw text
      if (lastLeft != -1)
      {
        //calculate line's middle
        middleLeft = +lastLeft + 0.5 * (pathsData[path].parts[parts].left - lastLeft);
        middleTop = +lastTop + 0.5 * (pathsData[path].parts[parts].top - lastTop);
        if (pathsData[path].parts[parts].hasOwnProperty('path_label') && pathsData[path].parts[parts].path_label != '')
        {
//          pathLabel.rect = this.canvas.rect(middleLeft, middleTop, 30, 15, 5).attr({fill: "#000", stroke: "#474747", "stroke-width": 1}); 
//          pathLabel.text = this.canvas.text(middleLeft+13, middleTop+6, pathsData[path].parts[parts].path_label).attr(txt); 

          // path label
          if (this.drawPathLabels)
          {
            pathLabel = {
              rect: '',
//              rect : this.canvas.rect(middleLeft, middleTop, 30, 15, 5).attr({fill: color, stroke: "#474747", "stroke-width": 1}),
              text : this.canvas.text(middleLeft+pathEngine.opt.textDeltaX, middleTop+pathEngine.opt.textDeltaY, pathsData[path].parts[parts].path_label).attr(this.opt.tooltipFont) 
            };
            
            width = pathLabel.text.getBBox().width;
            if (width != 0)
              pathLabel.rect = this.canvas.rect(middleLeft, middleTop, width + pathEngine.opt.textBoxMargin*2, 15, 5).attr({fill: this.opt.tooltipBackground, stroke: this.opt.tooltipStroke, "stroke-width": 1});            
          } 
          else
            pathLabel = {
              rect : this.canvas.rect(middleLeft, middleTop, 30, 15, 5).attr({fill: this.opt.tooltipBackground, stroke: this.opt.tooltipStroke, "stroke-width": 1}).hide(),
              text : this.canvas.text(middleLeft+pathEngine.opt.textDeltaX, middleTop+pathEngine.opt.textDeltaY, pathsData[path].parts[parts].path_label).attr(this.opt.tooltipFont).hide() 
            };
          
          pathLabel.rect.toFront();
          pathLabel.text.toFront();
          this.objectsSet.push(pathLabel.rect);
          this.objectsSet.push(pathLabel.text);
          this.objects.pathLabels.push(pathLabel);
          //this.objectsSet.push(this.canvas.text(middleLeft+10, middleTop+10, pathsData[path].parts[parts].path_label));
        }
      }
      
      lastLeft = pathsData[path].parts[parts].left;
      lastTop = pathsData[path].parts[parts].top;   
    }
    
    if (lastLeft != -1)
      pathSVG += 'L ' + lastLeft + ' ' + lastTop + ' ';
    
    pathSegment = this.canvas.path({stroke: color, "stroke-width": this.opt.strokeWidth,"stroke-dasharray": pathsData[path].style}, pathSVG).toBack();
    this.objectsSet.push(pathSegment);
    /*
    txt = {"font": '12px "Arial"', stroke: "none", fill: "#000"};
    label = this.canvas.text(0, 0, pathsData[path].label).attr(txt).hide();
    
    frame = this.canvas.rect(10, 10, 100, 30, 5).attr({fill: "#D8E5af", stroke: "#FFF", "stroke-width": 2}).hide();
    
    pathSegment.mouseover(function (e) {
      clearTimeout(leave_timer);
      frame.show().animate({x: e.pageX, y: e.pageY}, 200 * is_label_visible);
      label.show().animate({x: e.pageX + 50, y: e.pageY + 10}, 200 * is_label_visible);
      label.toFront();
      //label[0].attr({text: data + " hit" + ((data % 10 == 1) ? "" : "s")}).show().animate({x: newcoord.x * 1 + 50, y: newcoord.y * 1 + 12}, 200 * is_label_visible);
      //label[1].attr({text: lbl + " September 2008"}).show().animate({x: newcoord.x * 1 + 50, y: newcoord.y * 1 + 27}, 200 * is_label_visible);
      //dot.attr("r", 7);
      is_label_visible = true;
      //r.safari();
    });*/
    
//    path.mouseover(function () {      
//      frame.show().animate({x: middleLeft, y: middleTop}, 200);
//    });
//
    /*pathSegment.mouseout(function () {
      leave_timer = setTimeout("frame.hide(); label.hide();", 1000);
//      .animate({x: middleLeft, y: middleTop}, 1000);
//      frame.hide();
    });    */
    
  }
    
  //alert(pathSVG);
  //this.objects.attr({});
  pathEngine.bindMouse();
  
}

pathEngine.getPathCallback = function () {
  if(ajax.req.readyState == 4) 
  {
    var response = ajax.req.responseText;
//    alert(ajax.req.responseText);
    html = eval('(' + ajax.req.responseText + ')');
    
    //alert(ajax.req.responseText);
    $('#map').append(html.popup);
    
    pathEngine.drawPaths(html.paths);
        
    document.getElementById("pathArea").style.position = "absolute";
    document.getElementById("pathArea").style.top = document.getElementById("parts").style.top;
    document.getElementById("pathArea").style.left = document.getElementById("parts").style.left; 

   /* 
    $('a[rel=fancybox]').fancybox({
      'frameWidth':    230, 
     'frameHeight': 100,
     'hideOnContentClick': false}
    );
          
    $('.tooltip').tooltip({ 
        track: true, 
        delay: 0, 
        showURL: false, 
        showBody: " - ", 
        fade: 250 
    }); */     
  }  
}

pathEngine.removeCanvas = function() {
  if ($('#pathArea').length > 0)
    jQuery('#pathArea').remove();
  
  jQuery(".popup_marker").remove();
  jQuery(".marker_link").remove();  
}

pathEngine.drawsPathsAfterZoom = function() {
//  alert('aa');
  if (pathEngine.curPath.id == '')
    return;
  
  pathEngine.showPath('', 'zoom', pathEngine.curPath.id);
}

pathEngine.togglePathLabels = function() {
  this.drawPathLabels = !this.drawPathLabels;
  
  pathLabelsCnt = this.objects.pathLabels.length;
  
  for(var i=0; i < pathLabelsCnt; i++)
  {
    
    if (this.drawPathLabels)
    {
      this.objects.pathLabels[i].rect.show();
      this.objects.pathLabels[i].text.show();
      this.objects.pathLabels[i].rect.toFront();
      this.objects.pathLabels[i].text.toFront();            
    }
    else
    {
      this.objects.pathLabels[i].rect.hide();
      this.objects.pathLabels[i].text.hide();
    }      
  }
}

pathEngine.bindMouse = function() {
  $("#pathArea").mousemove(function(e){    
    mapEngine.lastPosX = mapEngine.posX;
    mapEngine.lastPosY = mapEngine.posY;
    mapEngine.posX = e.pageX;
    mapEngine.posY = e.pageY;       
    mapEngine.mapMouseMove();
    /*
    if (mapEngine.mouseDown == 1)
    {
      var deltaX = mapEngine.lastPosX - mapEngine.posX;
      var deltaY = mapEngine.lastPosY - mapEngine.posY;
      
      pathEngine.objectsSet.translate(-1 * deltaX, -1 * deltaY);
    }*/
    return false; 
     //if x,y > poza ramka mapy to mouseDown = 0;
  });  
}
